@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,600;1,400&family=Lora:ital,wght@0,400;0,500;0,600;1,400&display=swap');

/* ==== VARS ==== */
:root                           { --portal-primary: #7a9e8e; --portal-primary-light: #b5cfc3; --portal-primary-pale: #e2efe9; --project-icon-color: #7a9e8e; }
:root                           { --portal-accent: #d4a0a0; --portal-warm: #d4b896; --portal-lavender: #b0a8c8; --portal-sky: #a3c4d4; }
:root                           { --portal-accent-light: #f0dada; --portal-warm-light: #f2e6d4; --portal-lavender-light: #e0dcef; --portal-sky-light: #daeaf0; }
:root                           { --portal-white: #ffffff; --portal-gray-50: #fafaf8; --portal-gray-100: #f5f4f1; --portal-gray-200: #eceae5; }
:root                           { --portal-gray-300: #d6d3cc; --portal-gray-400: #b0aca3; --portal-gray-500: #8a857b; --portal-gray-600: #6b665d; }
:root                           { --portal-gray-700: #4a4640; --portal-gray-800: #2d2a26; }
:root                           { --portal-font-display: 'Lora', Georgia, serif; --portal-font-body: 'DM Sans', system-ui, sans-serif; }
:root                           { --portal-duration: 0.3s; --portal-ease: cubic-bezier(0.4, 0, 0.2, 1); }
:root                           { --portal-section-py: 5.5rem; --portal-card-radius: 1rem; }

/* ==== COMMON SETTINGS ==== */
img                             { max-width: 100%; height: auto; }
h1, h2, h3, h4, h5, h6         { font-weight: 400; font-family: var(--portal-font-display); color: var(--portal-primary); }
h1                              { color: var(--portal-gray-800); }
a                               { color: var(--portal-primary); text-decoration: none; transition: color var(--portal-duration) var(--portal-ease); }
a:hover                         { color: var(--portal-gray-800); }
p > br:first-child              { display: none; }
.error                          { color: red; }

/* ==== PAGE POSITIONING ==== */
body                            { padding-top: 78px; font-family: var(--portal-font-body); color: var(--portal-gray-700); -webkit-font-smoothing: antialiased; }

@media (min-width: 992px) {
body                            { padding-top: 112px; }
}

/* ==== ICONS ==== */

.ico:before, .icon:before       { content: ''; font-family: "Font Awesome 7 Pro"; margin-right: 5px; }
.ico:before, .icon:before       { color: var(--project-icon-color); padding-left: 1px; }
.ico.home:before                { content: '\f015'; }
.ico.status:before,
.icon.status:before             { content: '\f205'; }
.ico.phone:before               { content: '\f095'; }
.icon.user:before,
.ico.user:before                { content: '\f007'; }
.ico.envelope:before,
.icon.mail:before,
.ico.mail:before                { content: '\f0e0'; }
.ico.calendar:before            { content: '\f073'; }
.ico.folder:before              { content: '\f07c'; }
.ico.list:before                { content: '\f03a'; }
.ico.hourglass:before           { content: '\f251'; }
.ico.image:before               { content: '\f1c5'; }
.icon.time:before,
.ico.time:before                { content: '\f017'; }
.ico.pdf:before                 { content: '\f1c1'; }
.icon.credit:before,
.ico.credit:before              { content: '\f0d6'; }
.ico.profile:before             { content: '\f036'; }
.ico.favorite:before            { content: '\f004'; }
.ico.book:before                { content: '\f2b9'; }
.ico.mailcon:before             { content: '\f199'; margin-right: 7px; }
.icon.note:before,
.ico.note:before                { content: '\f249'; }
.icon.medal:before,
.ico.medal:before               { content: '\f091'; }
.ico.ban:before                 { content: '\f05e'; }
.ico.globe:before               { content: '\f0ac'; }
.ico.personal:before            { content: '\f044'; }
.ico.document:before            { content: '\f1c1'; }


/* ==== HEADER ==== */
#header                         { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; padding: 0.625rem 0; }
#header                         { background: rgba(255,255,255,0.94); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
#header                         { border-bottom: 1px solid var(--portal-gray-200); transition: box-shadow var(--portal-duration) var(--portal-ease); }
#header .inside                 { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; display: flex; align-items: center; gap: 1rem; }
#header .logo                   { display: flex; align-items: center; gap: 0.75rem; text-decoration: none; flex-shrink: 0; }
#header .logo img               { height: 56px; width: 56px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
#header .brand-text             { display: flex; flex-direction: column; line-height: 1.2; }
#header .brand-name             { font-family: var(--portal-font-display); font-size: 1.6rem; font-weight: 400; color: var(--portal-gray-800); }
#header .brand-sub              { font-family: var(--portal-font-body); font-size: 0.8rem; color: var(--portal-primary); letter-spacing: 0.06em; text-transform: uppercase; font-weight: 500; }
#header .nav                    { margin-left: auto; }
#header .nav ul.level_1         { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; gap: 0.25rem; }
#header .nav ul.level_1 li      { display: block; }
#header .nav ul.level_1 li a    { font-size: 0.9375rem; color: var(--portal-gray-500); padding: 0.5rem 1rem; display: block; }
#header .nav ul.level_1 li a    { border-radius: 100px; text-decoration: none; transition: color var(--portal-duration) var(--portal-ease); }
#header .nav ul.level_1 li a:hover,
#header .nav ul.level_1 li a.active { color: var(--portal-gray-800); }
#header .mobile_btn             { display: none; }
#header .nav ul.level_2         { display: none; }

@media (min-width: 992px) {
#header .nav ul.level_2         { position: fixed; top: 112px; left: 0; right: 0; z-index: 999; display: flex; justify-content: flex-start; list-style: none; margin: 0; padding: 0.625rem max(1.5rem, calc((100vw - 1200px) / 2 + 1.5rem)); gap: 0.375rem; background: rgba(250,250,248,0.96); border-bottom: 1px solid var(--portal-gray-200); box-shadow: 0 8px 24px rgba(45,42,38,0.06); overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: var(--portal-primary-light) transparent; }
#header .nav ul.level_2::-webkit-scrollbar { height: 4px; }
#header .nav ul.level_2::-webkit-scrollbar-thumb { background: var(--portal-primary-light); border-radius: 100px; }
#header .nav ul.level_2 li      { display: block; flex: 0 0 auto; }
#header .nav ul.level_2 li a    { display: inline-flex; align-items: center; min-height: 32px; white-space: nowrap; font-size: 0.8125rem; font-weight: 500; color: var(--portal-gray-600); padding: 0.375rem 0.875rem; border: 1px solid transparent; border-radius: 100px; background: transparent; transition: background var(--portal-duration) var(--portal-ease), border-color var(--portal-duration) var(--portal-ease), color var(--portal-duration) var(--portal-ease); }
#header .nav ul.level_2 li a:hover { color: var(--portal-gray-800); background: var(--portal-white); border-color: var(--portal-gray-200); }
#header .nav ul.level_2 li.active > a,
#header .nav ul.level_2 li a.active { background: var(--portal-primary); color: var(--portal-white) !important; border-color: var(--portal-primary); box-shadow: 0 3px 10px rgba(122,158,142,0.22); }
body:has(#header .nav ul.level_2) { padding-top: 160px; }
}
#header .nav ul.level_1 > li.last { order: 1; }
#header .nav ul.level_1 > li:nth-last-child(2) { order: 2; }
#header .nav ul.level_1 > li.last > a { border: 1.5px solid var(--portal-primary-light); border-radius: 100px; color: var(--portal-primary) !important; padding: 0.4rem 1.1rem !important; font-weight: 500; }
#header .nav ul.level_1 > li.last > a:hover { background: var(--portal-primary); color: var(--portal-white) !important; border-color: var(--portal-primary); }
#header .nav ul.level_1 > li:nth-last-child(2) > a { background: var(--portal-primary); color: var(--portal-white) !important; border-radius: 100px; padding: 0.4rem 1.1rem !important; font-weight: 500; }
#header .nav ul.level_1 > li:nth-last-child(2) > a:hover { background: var(--portal-gray-700); color: var(--portal-white) !important; }

@media (min-width: 992px) {
#header                         { padding: 1rem 0; }
#header .logo img               { height: 80px; width: 80px; }
}

/* ==== HERO ==== */
.cte_text.fullwidth.textcenter { position: relative; min-height: 480px; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; max-width: 2138px; margin-left: auto; margin-right: auto; }
.cte_text.fullwidth.textcenter { background-size: cover !important; background-position: center 30% !important; }
.cte_text.fullwidth.textcenter::after { content: ''; position: absolute; inset: 0; pointer-events: none; }
.cte_text.fullwidth.textcenter::after { background: linear-gradient(180deg, rgba(45,42,38,0.15) 0%, rgba(45,42,38,0.45) 100%); }
.cte_text.fullwidth.textcenter h1 { position: relative; z-index: 2; font-size: clamp(2rem, 5vw, 3.5rem); color: #fff !important; }
.cte_text.fullwidth.textcenter h1 { font-family: var(--portal-font-display); line-height: 1.15; text-shadow: 0 2px 20px rgba(0,0,0,0.15); margin: 0; }
.cte_text.fullwidth.textcenter .clear { display: none; }

@media (min-width: 768px) {
.cte_text.fullwidth.textcenter { min-height: clamp(480px, calc(100vw / 2.91), 735px); }
}

@media (max-width: 575px) {
.cte_text.fullwidth.textcenter { min-height: 340px; }
}

/* ==== INTRO ==== */
.cte_text.fullwidth.portal-gray-700 { padding: var(--portal-section-py) 1.5rem; text-align: center; background: var(--portal-gray-50); }
.cte_text.fullwidth.portal-gray-700 h2.bh { font-family: var(--portal-font-display); font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); line-height: 1.25; margin-bottom: 1.25rem; letter-spacing: -0.01em; }
.cte_text.fullwidth.portal-gray-700 p { font-size: 1.0625rem; line-height: 1.75; color: var(--portal-gray-500); max-width: 680px; margin-left: auto; margin-right: auto; }
.cte_text.fullwidth.portal-gray-700 p:has(br) { font-family: var(--portal-font-display); font-size: clamp(1.25rem, 2.5vw, 1.625rem); color: var(--portal-gray-800); line-height: 1.4; margin-top: 1.5rem; max-width: none; font-style: normal; }
.cte_text.fullwidth.portal-gray-700 p em { font-family: var(--portal-font-display); font-size: 1.25rem; color: var(--portal-primary); font-style: italic; display: block; margin-top: 1.5rem; }
.cte_text.fullwidth.portal-gray-700 p:has(a.button) { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; margin-top: 1.5rem; max-width: none; }
.cte_text.fullwidth.portal-gray-700 .clear { display: none; }

/* ==== UTILITIES ==== */
.text-center                    { text-align: center; }
.d-flex                         { display: flex; }
.flex-column                    { flex-direction: column; }
.gap-2                          { gap: 0.5rem; }
.mb-0                           { margin-bottom: 0; }
.mb-2                           { margin-bottom: 0.5rem; }
.mb-3                           { margin-bottom: 1rem; }
.mb-4                           { margin-bottom: 1.5rem; }
.mb-5                           { margin-bottom: 3rem; }
.mt-4                           { margin-top: 1.5rem; }
.mt-5                           { margin-top: 3rem; }
.pt-4                           { padding-top: 1.5rem; }
.mx-auto                        { margin-left: auto; margin-right: auto; }
.fw-600                         { font-weight: 600; }
.list-unstyled                  { list-style: none; padding: 0; margin: 0; }
.col-lg-4                       { flex: 0 0 auto; width: 100%; }
.portal-small                   { font-size: 0.8125rem; color: var(--portal-gray-400); }
.portal-lead                    { font-size: 1.125rem; line-height: 1.75; color: var(--portal-gray-500); }
.portal-divider                 { border: none; border-top: 1px solid var(--portal-gray-200); margin: 2rem 0; }

/* ==== BUTTONS ==== */
a.button                        { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.875rem 2.25rem; font-family: var(--portal-font-body); font-size: 1rem; font-weight: 500; border-radius: 100px; text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
a.button.primary                { background: var(--portal-primary); color: var(--portal-white); }
a.button.primary:hover          { background: var(--portal-gray-700); color: var(--portal-white); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
a.button.outline                { background: transparent; color: var(--portal-gray-600); border: 1.5px solid var(--portal-gray-300); }
a.button.outline:hover          { border-color: var(--portal-gray-500); color: var(--portal-gray-800); }

/* ==== CONTENT PAGES ==== */



/* Seitentitel (z.B. "Tierschutz") – kein Hero-Overlay, nur zentrierter Titel */
.cte_text.fullwidth.portal-gray-700.textcenter { min-height: 0; }
.cte_text.fullwidth.portal-gray-700.textcenter::after { display: none; }
.cte_text.fullwidth.portal-gray-700.textcenter h1 { color: var(--portal-primary) !important; font-size: clamp(2rem, 4vw, 3rem); text-shadow: none; position: static; z-index: auto; }

/* Hero mit figure>img (z.B. Seehundstation, BJu-Tierschutzprojekt) */
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure) { position: relative; min-height: 420px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; overflow: hidden; padding: 2rem 1.5rem; background: var(--portal-gray-800) !important; }
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure) figure { position: absolute; inset: 0; margin: 0; padding: 0; }
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure) figure img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; display: block; }
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure)::after { display: block !important; background: linear-gradient(180deg, rgba(45,42,38,0.15) 0%, rgba(45,42,38,0.55) 100%); }
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure) h1 { position: relative; z-index: 2; color: #fff !important; font-size: clamp(2rem, 5vw, 3.5rem); text-shadow: 0 2px 20px rgba(0,0,0,0.15); }
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure) p  { position: relative; z-index: 2; color: rgba(255,255,255,0.88); font-size: 1.125rem; max-width: none; }
.cte_text.fullwidth.portal-gray-700.textcenter:has(figure) .clear { display: none; }

/* Content-Bereich nach Hero (Seehundstation / BJu-Tierschutzprojekt) */
#main .inside > .row.justify-content-center { padding: var(--portal-section-py) 1.5rem; background: var(--portal-white); }
#main .inside > .row.justify-content-center > .col-lg-8 { max-width: 780px; width: 100%; }

/* .widthlogo Block (z.B. Geldsegen) */
.cte_text.widthlogo       { background: var(--portal-white); padding: var(--portal-section-py) 1.5rem; text-align: center; }
.cte_text.widthlogo + .cte_text.widthlogo { background: var(--portal-gray-50); }
.cte_text.widthlogo h2.bh { font-size: clamp(1.625rem, 3vw, 2.25rem); margin-bottom: 1.5rem; display: flex; align-items: center; justify-content: center; gap: 1rem; }
.cte_text.widthlogo h2.bh::before { content: ''; display: inline-block; width: 48px; height: 48px; border-radius: 50%; background: url('https://www.bju-tiere-im-glueck.de/files/layout/img/logo.svg') center/cover no-repeat; flex-shrink: 0; }
.cte_text.widthlogo p     { font-size: 1.0625rem; line-height: 1.8; color: var(--portal-gray-600); max-width: 680px; margin-left: auto; margin-right: auto; }
.cte_text.widthlogo .clear { display: none; }

/* Generische Textblöcke (nur in #main, nicht Footer) */
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) { padding: var(--portal-section-py) 1.5rem; text-align: center; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) h2.bh { font-size: clamp(1.625rem, 3vw, 2.25rem); margin-bottom: 0.75rem; }
#main .cte_text ul,
#main .cte_text ol          { list-style-position: inside; }
#main .cte_text ul,
#main .cte_text ol,
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) p { font-size: 1.0625rem; line-height: 1.8; color: var(--portal-gray-600); max-width: 780px; margin-left: auto; margin-right: auto; margin-bottom: 1.25rem; text-align: center; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) p:last-of-type { margin-bottom: 0; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) p em { color: var(--portal-gray-500); font-style: italic; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) a[href^="mailto"] { color: var(--portal-primary); font-weight: 500; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) p:has(a.button) { display: flex; justify-content: center; gap: 0.75rem; flex-wrap: wrap; margin-top: 1rem; max-width: none; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700) .clear { display: none; }
.cte_text.widthlogo p     { margin-bottom: 1.25rem; }
.cte_text.widthlogo p:last-of-type { margin-bottom: 0; }

/* ==== LEGAL PAGES ==== */
#main .cte_text.portal-legal,
#main .cte_text:not(.fullwidth):has(h1.bh) { padding: var(--portal-section-py) 1.5rem; background: var(--portal-white); text-align: center; }
#main .cte_text.portal-legal h1.bh,
#main .cte_text.portal-legal h2.bh,
#main .cte_text:not(.fullwidth):has(h1.bh) h1.bh { font-size: clamp(1.75rem, 3vw, 2.5rem); margin-bottom: 2rem; color: var(--portal-primary); }
#main .cte_text.portal-legal p,
#main .cte_text:not(.fullwidth):has(h1.bh) p { font-size: 1rem; line-height: 1.85; color: var(--portal-gray-600); max-width: 780px; margin-left: auto; margin-right: auto; margin-bottom: 1.25rem; text-align: left; }
#main .cte_text.portal-legal p:last-of-type,
#main .cte_text:not(.fullwidth):has(h1.bh) p:last-of-type { margin-bottom: 0; }
#main .cte_text.portal-legal .clear,
#main .cte_text:not(.fullwidth):has(h1.bh) .clear { display: none; }

/* ==== DONATION BANNER ==== */
.cte_text.portal-gray-700:not(.fullwidth) { background: linear-gradient(135deg, var(--portal-gray-100) 0%, var(--portal-gray-50) 100%); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 2rem 2.5rem; text-align: center; max-width: 1140px; margin: var(--portal-section-py) auto; }
.cte_text.portal-gray-700:not(.fullwidth) .portal-donation-banner__icon { font-size: 2rem; margin-bottom: 0.75rem; }
.cte_text.portal-gray-700:not(.fullwidth) h2 { font-size: 1.25rem; color: var(--portal-primary); margin-bottom: 0.5rem; }
.cte_text.portal-gray-700:not(.fullwidth) p { font-size: 0.9375rem; line-height: 1.65; color: var(--portal-gray-500); max-width: 540px; margin-left: auto; margin-right: auto; }
.cte_text.portal-gray-700:not(.fullwidth) p:has(.portal-badge) { max-width: none; margin-top: 0.75rem; }
.cte_text.portal-gray-700:not(.fullwidth) .portal-badge { display: inline-block; padding: 0.25rem 0.75rem; background: var(--portal-gray-200); color: var(--portal-gray-600); border-radius: 100px; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.03em; }
.cte_text.portal-gray-700:not(.fullwidth) .clear { display: none; }

/* ==== CHARITY TILES ==== */
.text-center h3                 { color: var(--portal-primary); }
.text-decoration-none           { text-decoration: none; }
.portal-charity-grid            { display: grid; gap: 1rem; }
.portal-charity-tile            { background: var(--portal-white); border: 1.5px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 1.25rem 1rem; text-align: center; cursor: pointer; transition: all var(--portal-duration) var(--portal-ease); position: relative; }
.portal-charity-tile:hover      { border-color: var(--portal-gray-300); box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 28px rgba(0,0,0,0.06); transform: translateY(-2px); }
.portal-charity-tile__logo      { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; margin-bottom: 0.75rem; border: 2px solid var(--portal-gray-100); }
.portal-charity-tile__name      { font-family: var(--portal-font-display); font-size: 0.9375rem; color: var(--portal-gray-800); margin-bottom: 0.125rem; }
.portal-charity-tile__location  { font-size: 0.75rem; color: var(--portal-gray-400); }

/* ==== CATEGORY CARDS ==== */
.block:has(.portal-category-card) { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-50); }
.block:has(.portal-category-card) > div { max-width: 1140px; margin-left: auto; margin-right: auto; }
.row                            { display: flex; flex-wrap: wrap; }
.g-4                            { gap: 1.5rem; }
.justify-content-center         { justify-content: center; }
.col-6                          { flex: 0 0 auto; width: calc(50% - 0.75rem); }
.col-lg-6                       { flex: 0 0 auto; width: 100%; }
.portal-category-card           { position: relative; border-radius: var(--portal-card-radius); overflow: hidden; aspect-ratio: 1 / 1; cursor: pointer; transition: transform var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.portal-category-card:hover     { transform: translateY(-4px); box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 28px rgba(0,0,0,0.06); }
.portal-category-card img       { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s var(--portal-ease); }
.portal-category-card:hover img { transform: scale(1.05); }
.portal-category-card__overlay  { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(45,42,38,0.6) 0%, rgba(45,42,38,0.0) 50%); display: flex; align-items: flex-end; padding: 1.5rem; }
.portal-category-card__label    { font-family: var(--portal-font-display); font-size: 1.375rem; color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,0.2); }

/* ==== BTN-PORTAL ==== */
.btn-portal                     { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.875rem 2.25rem; font-family: var(--portal-font-body); font-size: 1rem; font-weight: 500; border-radius: 100px; border: none; cursor: pointer; text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
.btn-portal--primary            { background: var(--portal-primary); color: var(--portal-white); }
.btn-portal--primary:hover      { background: var(--portal-gray-700); color: var(--portal-white); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.btn-portal--outline            { background: transparent; color: var(--portal-gray-600); border: 1.5px solid var(--portal-gray-300); }
.btn-portal--outline:hover      { border-color: var(--portal-gray-500); color: var(--portal-gray-800); }

/* ==== FOOTER ==== */
#footer                         { background: var(--portal-white); border-top: 1px solid var(--portal-gray-200); padding: 3rem 0 2rem; color: var(--portal-gray-400); font-size: 0.875rem; }
#footer .inside                 { max-width: 1140px; margin: 0 auto; padding: 0 1.5rem; }
#footer a                       { color: var(--portal-gray-500); text-decoration: none; transition: color var(--portal-duration) var(--portal-ease); }
#footer a:hover                 { color: var(--portal-gray-800); }
#footer p                       { color: var(--portal-gray-400); font-size: 0.875rem; }
.portal-footer__brand           { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
.portal-footer__brand img       { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.portal-footer__brand-text      { font-family: var(--portal-font-display); font-size: 1.125rem; color: var(--portal-gray-800); }
.portal-footer__contact         { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 1.25rem; }
.portal-footer__contact a       { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; }
.portal-footer__contact a::before          { content: ''; display: inline-block; width: 14px; height: 14px; background-repeat: no-repeat; background-size: contain; flex-shrink: 0; opacity: 0.6; }
.portal-footer__contact a[href^="tel"]::before    { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%238a857b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6A19.79 19.79 0 012.12 4.18 2 2 0 014.11 2h3a2 2 0 012 1.72c.12.96.36 1.9.7 2.81a2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.91.34 1.85.58 2.81.7A2 2 0 0122 16.92z'/%3E%3C/svg%3E"); }
.portal-footer__contact a[href^="mailto"]::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%238a857b' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/%3E%3Cpolyline points='22,6 12,13 2,6'/%3E%3C/svg%3E"); }
#footer h6                      { font-size: 0.8125rem; letter-spacing: 0.04em; }

/* ==== FORM ELEMENTS (global — gilt für alle .block form: login, register, kontakt etc.) ==== */
.block form .row                { display: block; margin-bottom: 1.25rem; }
.block form label               { display: block; font-size: 0.8125rem; font-weight: 500; color: var(--portal-gray-600); letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 0.375rem; }
.block form label .asterisk     { color: var(--portal-primary); margin-left: 0.125rem; }
.block form input.text          { width: 100%; padding: 0.75rem 1rem; font-family: var(--portal-font-body); font-size: 1rem; color: var(--portal-gray-800); background: var(--portal-gray-50); border: 1.5px solid var(--portal-gray-200); border-radius: 0.5rem; outline: none; transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); box-sizing: border-box; }
.block form select.select       { width: 100%; padding: 0.75rem 1rem; font-family: var(--portal-font-body); font-size: 1rem; color: var(--portal-gray-800); background: var(--portal-gray-50); border: 1.5px solid var(--portal-gray-200); border-radius: 0.5rem; outline: none; appearance: none; box-sizing: border-box; }
.block form input.text:focus,
.block form select.select:focus { border-color: var(--portal-primary-light); box-shadow: 0 0 0 3px var(--portal-primary-pale); background: var(--portal-white); }
.block form .row.check          { display: flex; align-items: flex-start; gap: 0.625rem; margin-top: 1rem; }
.block form .row.check label    { text-transform: none; letter-spacing: 0; font-size: 0.8125rem; color: var(--portal-gray-500); font-weight: 400; margin-bottom: 0; }
.block form input[type="checkbox"] { width: 16px; height: 16px; flex-shrink: 0; accent-color: var(--portal-primary); margin-top: 0.1rem; cursor: pointer; }
.block form input.submit        { width: 100%; padding: 0.875rem 2.25rem; font-family: var(--portal-font-body); font-size: 1rem; font-weight: 500; border-radius: 100px; border: none; cursor: pointer; background: var(--portal-primary); color: var(--portal-white); transition: all var(--portal-duration) var(--portal-ease); margin-top: 0.5rem; }
.block form input.submit:hover  { background: var(--portal-gray-700); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.block form .help               { display: none; }
.block form .row.retraction     { font-size: 0.8125rem; color: var(--portal-gray-400); margin-top: 0.5rem; }
.block form p:has(.asterisk)    { font-size: 0.75rem; color: var(--portal-gray-400); margin-top: 1rem; }

/* ==== CONTACT FORM ==== */
.cte_form.block                 { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-50); }
.cte_form.block h1.bh           { text-align: center; font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 0; }
.cte_form form                  { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 2rem 2.5rem; max-width: 600px; margin: 2rem auto 0; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03); }
.cte_form textarea              { width: 275% !important; height: 160px; padding: 0.75rem 1rem; font-family: var(--portal-font-body); font-size: 1rem; color: var(--portal-gray-800); background: var(--portal-gray-50); border: 1.5px solid var(--portal-gray-200); border-radius: 0.5rem; outline: none; transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); box-sizing: border-box !important; resize: vertical; }
.cte_form textarea:focus        { border-color: var(--portal-primary-light); box-shadow: 0 0 0 3px var(--portal-primary-pale); background: var(--portal-white); }
.cte_form .textdiv              { display: block; width: 100%; max-width: 100%; }
.cte_form .submit_div           { margin-top: 1.5rem; }

/* ==== ANIMATIONS ==== */
@keyframes pulse-dot {
from, to                        { opacity: 1; }
50%                             { opacity: 0.4; }
}

@keyframes fadeInUp {
from                            { opacity: 0; transform: translateY(20px); }
to                              { opacity: 1; transform: translateY(0); }
}
.portal-animate                 { animation: fadeInUp 0.6s var(--portal-ease) both; }
.portal-animate--d1             { animation-delay: 0.1s; }
.portal-animate--d2             { animation-delay: 0.2s; }
.portal-animate--d3             { animation-delay: 0.3s; }
.portal-animate--d4             { animation-delay: 0.4s; }
.portal-animate--d5             { animation-delay: 0.5s; }
.portal-animate--d6             { animation-delay: 0.6s; }

/* ==== ÜBER BJU – INTRO ==== */
#main .cte_text.portal-intro { padding: var(--portal-section-py) 1.5rem; text-align: center; background: var(--portal-gray-50); }
#main .cte_text.portal-intro h2.bh { font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); line-height: 1.25; margin-bottom: 1.25rem; }
#main .cte_text.portal-intro p { font-size: 1.0625rem; line-height: 1.75; color: var(--portal-gray-500); max-width: 680px; margin-left: auto; margin-right: auto; }
#main .cte_text.portal-intro .portal-statement { font-family: var(--portal-font-display); font-size: clamp(1.25rem, 2.5vw, 1.625rem); color: var(--portal-gray-800); line-height: 1.4; margin-top: 2rem; }
#main .cte_text.portal-intro .clear { display: none; }

/* ==== WHITE SECTION (z.B. Warum BJu) ==== */
.cte_text.portal-section--alt { background: var(--portal-white); padding: var(--portal-section-py) 1.5rem; }
.cte_text.portal-section--alt .clear { display: none; }

/* ==== PORTAL-ABOUT-LOGO-ACCENT ==== */
.portal-about-logo-accent       { display: flex; align-items: center; gap: 1rem; justify-content: center; margin-bottom: 1.5rem; }
.portal-about-logo-accent img   { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.portal-about-logo-accent h2    { margin-bottom: 0; }

/* ==== ZWEI-SPALTEN GRID ==== */
.portal-two-col                 { display: flex; flex-direction: column; gap: 1.5rem; }

/* ==== ACCORDION ==== */
.portal-accordion               { display: flex; flex-direction: column; }
/* details/summary (nativ) */
.portal-accordion details,
.portal-accordion .accordion-item { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); margin-bottom: 0.75rem; overflow: hidden; }
.portal-accordion summary,
.portal-accordion .accordion-button { cursor: pointer; padding: 1.25rem 1.5rem; display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; list-style: none; width: 100%; background: none; border: none; text-align: left; }
.portal-accordion summary,
.portal-accordion .accordion-button { font-family: var(--portal-font-display); font-size: 1.3125rem; color: var(--portal-gray-800); transition: color var(--portal-duration) var(--portal-ease); }
.portal-accordion summary::-webkit-details-marker { display: none; }
.portal-accordion summary::after,
.portal-accordion .accordion-button::after { content: ''; display: inline-block; width: 1rem; height: 1rem; flex-shrink: 0; margin-top: 0.3rem; background-repeat: no-repeat; background-size: contain; transition: transform var(--portal-duration) var(--portal-ease); }
.portal-accordion summary::after,
.portal-accordion .accordion-button::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23b0aca3' viewBox='0 0 16 16'%3E%3Cpath d='M2.146 5.646a.5.5 0 01.708 0L8 10.793l5.146-5.147a.5.5 0 01.708.708l-5.5 5.5a.5.5 0 01-.708 0l-5.5-5.5a.5.5 0 010-.708z'/%3E%3C/svg%3E"); }
.portal-accordion details[open] summary,
.portal-accordion .accordion-button:not(.collapsed) { color: var(--portal-primary); background: var(--portal-gray-50); }
.portal-accordion details[open] summary::after,
.portal-accordion .accordion-button:not(.collapsed)::after { transform: rotate(180deg); }
.portal-accordion details[open] .accordion-body,
.portal-accordion .accordion-collapse.show { animation: fadeInUp 0.2s var(--portal-ease) both; }
.portal-accordion .accordion-collapse      { display: none; }
.portal-accordion .accordion-collapse.show { display: block; }
.portal-accordion h3.accordion-header      { margin: 0; }
.portal-accordion .accordion-sub          { display: block; font-family: var(--portal-font-body); font-size: 0.9375rem; color: var(--portal-gray-500); font-weight: 400; margin-top: 0.25rem; }
.portal-accordion .accordion-body         { padding: 0 1.5rem 1.25rem; font-size: 0.9375rem; line-height: 1.75; color: var(--portal-gray-600); }
.portal-accordion .accordion-body p       { margin-bottom: 0.75rem; }
.portal-accordion .accordion-body p:last-child { margin-bottom: 0; }
.portal-accordion .accordion-body ul      { padding-left: 1.5rem; line-height: 2; }

/* ==== BLOCKQUOTE ==== */
.portal-blockquote              { position: relative; padding: 2rem 2.5rem; background: var(--portal-gray-100); border-radius: var(--portal-card-radius); border-left: 4px solid var(--portal-primary); margin-bottom: 2rem; }
.portal-blockquote::before      { content: '\201C'; position: absolute; top: 0.5rem; left: 1rem; font-family: var(--portal-font-display); font-size: 4rem; line-height: 1; color: var(--portal-primary-light); pointer-events: none; }
.portal-blockquote p            { font-family: var(--portal-font-display); font-size: 1.1875rem; font-style: italic; line-height: 1.6; color: var(--portal-gray-700); margin-bottom: 0.75rem; }
.portal-blockquote cite         { font-family: var(--portal-font-body); font-size: 0.875rem; font-style: normal; color: var(--portal-gray-400); }

/* ==== AVATAR ==== */
.portal-avatar                  { width: 180px; height: 180px; border-radius: 50%; object-fit: cover; border: 4px solid var(--portal-white); box-shadow: 0 4px 20px rgba(0,0,0,0.08); display: block; margin: 0 auto; }

/* ==== CONTENT NARROW ==== */
.portal-content-narrow          { max-width: 780px; margin-left: auto; margin-right: auto; }

/* ==== STANDALONE CONTENT BLOCKS (z.B. Berater-werden) ==== */
/* Alten Duplicate-Block (cte_text ohne fullwidth + textcenter) ausblenden */
.cte_text.portal-gray-700.textcenter:not(.fullwidth) { display: none; }
/* Standalone portal-intro / portal-content-block direkt in #main .inside */
#main .inside > .portal-intro    { padding: var(--portal-section-py) 1.5rem 2rem; text-align: center; background: var(--portal-gray-50); }
#main .inside > .portal-content-block { max-width: 780px; margin: 0 auto 2rem; padding: 0 1.5rem; }
#main .inside > hr.portal-divider { display: none; }
#main .inside > .text-center     { max-width: 780px; margin: 0 auto; padding: 1rem 1.5rem var(--portal-section-py); }

/* ==== H5 + CITE IN TEXTBLÖCKEN ==== */
#main .cte_text h5        { font-family: var(--portal-font-display); font-size: 1.1rem; color: var(--portal-gray-800); line-height: 1.5; font-weight: 400; margin-top: 2.5rem; font-style: italic; }
#main .cte_text cite      { font-family: var(--portal-font-body); font-size: 0.875rem; color: var(--portal-gray-400); font-style: normal; display: block; margin-top: 0.5rem; }

/* ==== PORTAL-HERO-IMAGE (img-basierter Hero, z.B. Charity-Detailseiten) ==== */
.portal-hero-image              { position: relative; min-height: 400px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.portal-hero-image__bg          { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.portal-hero-image__overlay     { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(45,42,38,0.15) 0%, rgba(45,42,38,0.45) 100%); }
.portal-hero-image__content     { position: relative; z-index: 2; padding: 2rem 1rem; text-align: center; }
.portal-hero-image__content h1  { font-family: var(--portal-font-display); font-size: clamp(2rem, 5vw, 3.5rem); color: var(--portal-white); line-height: 1.15; text-shadow: 0 2px 20px rgba(0,0,0,0.15); margin-bottom: 0.5rem; }
.portal-hero-image__content p   { font-size: 1.125rem; color: rgba(255,255,255,0.88); max-width: 480px; margin: 0 auto; }

/* ==== BREADCRUMB ==== */
.portal-breadcrumb              { font-size: 0.8125rem; color: var(--portal-gray-400); padding: 1rem 1.5rem; max-width: 1140px; margin: 0 auto; }
.portal-breadcrumb a            { color: var(--portal-gray-400); text-decoration: none; transition: color var(--portal-duration) var(--portal-ease); }
.portal-breadcrumb a:hover      { color: var(--portal-gray-700); }
.portal-breadcrumb .separator   { margin: 0 0.5rem; opacity: 0.4; }

/* ==== PORTAL-CONTENT-BLOCK ==== */
.portal-content-block           { margin-bottom: 2.5rem; }
.portal-content-block h3        { font-family: var(--portal-font-display); font-size: 1.375rem; margin-bottom: 0.375rem; }
.portal-content-sub             { font-family: var(--portal-font-body); font-size: 0.9375rem; color: var(--portal-gray-400); font-style: italic; margin-bottom: 1rem; display: block; }
.portal-content-block p         { font-size: 1.0625rem; line-height: 1.8; color: var(--portal-gray-600); }

/* ==== BTN-PORTAL GRÖSSEN ==== */
.btn-portal--sm                 { padding: 0.5rem 1.25rem; font-size: 0.8125rem; }
.btn-portal--lg                 { padding: 0.875rem 2.25rem; font-size: 1rem; }

/* ==== ANIMATION D0 ==== */
.portal-animate--d0             { animation-delay: 0s; }

/* ==== ADVISOR MINI (Startseite Berater-Leiste) ==== */
.portal-advisor-mini            { text-align: center; transition: transform var(--portal-duration) var(--portal-ease); }
.portal-advisor-mini:hover      { transform: translateY(-3px); }
.portal-advisor-mini__photo     { width: 100%; aspect-ratio: 1; border-radius: var(--portal-card-radius); object-fit: cover; }
.portal-advisor-mini__photo     { border: 2px solid var(--portal-gray-100); transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.portal-advisor-mini:hover .portal-advisor-mini__photo { border-color: var(--portal-primary-light); box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.portal-advisor-mini__name      { font-family: var(--portal-font-display); font-size: 0.9375rem; color: var(--portal-gray-700); margin-top: 0.625rem; }

/* ==== PORTAL-TAG ==== */
.portal-tag                     { display: inline-block; padding: 0.1875rem 0.625rem; font-size: 0.6875rem; font-weight: 500; border-radius: 100px; background: var(--portal-gray-100); color: var(--portal-gray-500); }

/* ==== PORTAL-CARD (Berater-Listing) ==== */
.portal-card                    { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); overflow: hidden; transition: all var(--portal-duration) var(--portal-ease); height: 100%; display: flex; flex-direction: column; }
.portal-card:hover              { box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 28px rgba(0,0,0,0.06); border-color: var(--portal-gray-300); transform: translateY(-3px); }
.portal-card__image             { position: relative; padding-top: 100%; background: var(--portal-gray-100); overflow: hidden; }
.portal-card__image img         { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s var(--portal-ease); }
.portal-card:hover .portal-card__image img { transform: scale(1.03); }
.portal-card__status            { position: absolute; top: 0.75rem; left: 0.75rem; display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.625rem; }
.portal-card__status            { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; border-radius: 100px; backdrop-filter: blur(8px); }
.portal-card__status--online    { background: rgba(226,239,233,0.92); color: #4a7a66; }
.portal-card__status--online::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #4a7a66; animation: pulse-dot 2s infinite; display: inline-block; }
.portal-card__status--offline   { background: rgba(236,234,229,0.92); color: var(--portal-gray-400); }
.portal-card__body              { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; position: relative; }
.portal-card__name              { font-family: var(--portal-font-display); font-size: 1.125rem; color: var(--portal-gray-800); margin-bottom: 0.25rem; }
.portal-card__tagline           { font-size: 0.8125rem; color: var(--portal-gray-400); margin-bottom: 0.75rem; line-height: 1.5; }
.portal-card__tagline           { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.portal-card__tags              { display: flex; flex-wrap: wrap; gap: 0.375rem; margin-bottom: 1rem; }
.portal-card__footer            { margin-top: auto; display: flex; align-items: center; justify-content: space-between; padding-top: 0.75rem; border-top: 1px solid var(--portal-gray-100); }
.portal-card__price             { font-size: 0.875rem; font-weight: 600; color: var(--portal-gray-700); }
.portal-card__ref               { font-size: 0.75rem; color: var(--portal-gray-400); transition: color var(--portal-duration) var(--portal-ease); }
.portal-card:hover .portal-card__ref { color: var(--portal-primary); }
.portal-card__pet               { position: absolute; top: -22px; right: 1.25rem; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; border: 3px solid var(--portal-white); box-shadow: 0 2px 8px rgba(0,0,0,0.1); z-index: 2; }

/* ==== PORTAL-PROFILE-BANNER ==== */
.portal-profile-banner          { position: relative; overflow: hidden; }
.portal-profile-banner__bg      { width: 100%; height: 380px; object-fit: cover; object-position: center 40%; display: block; }
.portal-profile-banner__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(45,42,38,0.55) 0%, rgba(45,42,38,0.30) 55%, rgba(45,42,38,0.15) 100%); }
.portal-profile-banner__content { position: absolute; inset: 0; display: flex; align-items: center; }
.portal-profile-banner__inner   { width: 100%; padding: 0 1.5rem; }
.portal-profile-banner__avatar  { width: 160px; height: 160px; border-radius: 50%; object-fit: cover; border: 5px solid var(--portal-white); box-shadow: 0 4px 24px rgba(0,0,0,0.15); flex-shrink: 0; }
.portal-profile-banner__name    { font-family: var(--portal-font-display); font-size: clamp(1.75rem, 3.5vw, 2.75rem); color: var(--portal-white); line-height: 1.15; text-shadow: 0 2px 12px rgba(0,0,0,0.2); margin-bottom: 0.25rem; }
.portal-profile-banner__tagline { font-size: 1rem; color: rgba(255,255,255,0.85); max-width: 460px; }
.portal-profile-banner__status  { display: inline-flex; align-items: center; gap: 0.375rem; padding: 0.25rem 0.75rem; border-radius: 100px; }
.portal-profile-banner__status  { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; background: rgba(226,239,233,0.92); color: #4a7a66; margin-bottom: 0.625rem; }
.portal-profile-banner__status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #4a7a66; animation: pulse-dot 2s infinite; display: inline-block; }
.portal-profile-banner .portal-card__tags .portal-tag { background: rgba(255,255,255,0.15); color: rgba(255,255,255,0.9); backdrop-filter: blur(4px); border: 1px solid rgba(255,255,255,0.15); }
.portal-profile-meta--light .portal-profile-meta__item { color: rgba(255,255,255,0.75); }

/* ==== PORTAL-PROFILE-META ==== */
.portal-profile-meta            { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 1rem; }
.portal-profile-meta__item      { display: flex; align-items: center; gap: 0.375rem; font-size: 0.875rem; color: var(--portal-gray-500); }
.portal-profile-meta__item svg  { width: 16px; height: 16px; opacity: 0.5; }

/* ==== PORTAL-PROFILE-CONTENT ==== */
.portal-profile-content         { padding: 3rem 0 5rem; }
.portal-profile-section         { margin-bottom: 2.5rem; }
.portal-profile-section h3      { font-family: var(--portal-font-display); font-size: 1.25rem; color: var(--portal-primary); font-weight: 400; margin-bottom: 1rem; }
.portal-profile-section p       { line-height: 1.75; color: var(--portal-gray-600); }

/* ==== PORTAL-PROFILE-SECTIONS (Template-Block nach .ajax + .profile.detail) ==== */
.portal-profile-sections        { background: var(--portal-white); max-width: 1140px; margin: 0 auto; padding: 3rem 1.5rem var(--portal-section-py); }
.portal-profile-sections .portal-profile-section { margin-bottom: 2.5rem; }
.portal-profile-sections .portal-profile-section p { margin-bottom: 1rem; }
.portal-profile-sections .portal-profile-section p:last-child { margin-bottom: 0; }

/* ==== PORTAL-SIDEBAR-CARD ==== */
.portal-sidebar-card            { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 1.5rem; position: sticky; top: 7.5rem; }
.portal-sidebar-card__price     { font-family: var(--portal-font-display); font-size: 2rem; color: var(--portal-gray-800); }
.portal-sidebar-card__price small { font-family: var(--portal-font-body); font-size: 0.875rem; color: var(--portal-gray-400); font-weight: 400; }

/* ==== PORTAL-REVIEW ==== */
.portal-review                  { padding: 1.25rem 0; border-bottom: 1px solid var(--portal-gray-100); }
.portal-review:last-child       { border-bottom: none; }
.portal-review__stars           { color: var(--portal-warm); font-size: 0.875rem; }
.portal-review__text            { font-size: 0.9375rem; line-height: 1.7; color: var(--portal-gray-600); margin: 0.5rem 0; }
.portal-review__author          { font-size: 0.8125rem; color: var(--portal-gray-400); }

/* ==== PORTAL-PHOTO-GRID ==== */
.portal-photo-grid              { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.75rem; }
.portal-photo-grid img          { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--portal-card-radius); border: 2px solid var(--portal-gray-100); }
.portal-photo-grid img          { transition: transform var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.portal-photo-grid img:hover    { transform: scale(1.03); box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 28px rgba(0,0,0,0.06); }

@media (min-width: 576px) {
.col-sm-6                       { width: calc(50% - 0.75rem); }
}

@media (min-width: 768px) {
.col-md-4                       { width: calc(33.333% - 1rem); }
.portal-hero-image              { min-height: 560px; }
.portal-profile-banner__bg      { height: 420px; }
.portal-profile-banner__avatar  { width: 180px; height: 180px; }
}

/* ==== ÜBER BJU SEITE ==== */
.block:has(.portal-about-logo-accent)       { padding: var(--portal-section-py) 1.5rem; background: var(--portal-white); }
.block:has(.portal-about-logo-accent) > .row.g-4 { max-width: 1140px; margin: 0 auto; }
.block:has(.portal-about-logo-accent) > .block  { background: var(--portal-gray-50); padding: var(--portal-section-py) 1.5rem; margin-top: var(--portal-section-py); margin-left: -1.5rem; margin-right: -1.5rem; margin-bottom: calc(-1 * var(--portal-section-py)); }
.block:has(.portal-about-logo-accent) > .block > .text-center h2 { font-family: var(--portal-font-display); font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); margin-bottom: 2rem; }
.block:has(.portal-about-logo-accent) > .block > .row { max-width: 1140px; margin-left: auto; margin-right: auto; width: 100%; }
.block:has(.portal-about-logo-accent) > .block p    { font-size: 1.0625rem; line-height: 1.8; color: var(--portal-gray-600); }
.block:has(.portal-about-logo-accent) > .block h5   { font-family: var(--portal-font-display); font-size: clamp(1.2rem, 2.5vw, 1.5rem); color: var(--portal-primary); line-height: 1.6; font-weight: 400; font-style: italic; margin-top: 2.5rem; margin-bottom: 0.5rem; }
.block:has(.portal-about-logo-accent) > .block cite { font-family: var(--portal-font-body); font-size: 0.875rem; color: var(--portal-gray-400); font-style: normal; display: block; margin-top: 0.375rem; }

@media (min-width: 992px) {
.col-lg-4                       { width: 33.333%; }
.col-lg-6                       { width: calc(50% - 0.75rem); }
.col-lg-2                       { width: 16.666%; }
.col-lg-8                       { width: 66.666%; }
.portal-two-col                 { display: grid; grid-template-columns: 1fr 1fr; }
}

@media (min-width: 1200px) {
.col-xl-3                       { width: calc(25% - 1.125rem); }
}

@media (max-width: 991px) {
:root                           { --portal-section-py: 4rem; }
.portal-sidebar-card            { position: static; }
}

@media (max-width: 767px) {
.portal-profile-banner          { min-height: 520px; }
.portal-profile-banner__bg      { height: auto; min-height: 100%; }
.portal-profile-banner__name    { font-size: 1.625rem; }
.portal-profile-banner__avatar  { width: 120px; height: 120px; margin: 0 auto 1rem; }
}

@media (max-width: 575px) {
:root                           { --portal-section-py: 3rem; }
.portal-photo-grid              { grid-template-columns: repeat(2, 1fr); }
}

/* ==== LOGIN ==== */
.mod_login                      { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-50); min-height: 60vh; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.mod_login h2.bh                { text-align: center; font-size: clamp(1.75rem, 3vw, 2.5rem); color: var(--portal-primary); margin-bottom: 2rem; }
.mod_login form                 { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 2rem 2.5rem; width: 100%; max-width: 420px; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03); display: flex; flex-direction: column; gap: 1rem; }
.mod_login a.pwlink             { text-align: center; font-size: 0.8125rem; color: var(--portal-gray-400); transition: color var(--portal-duration) var(--portal-ease); }
.mod_login a.pwlink:hover       { color: var(--portal-primary); }

/* ==== REGISTRIERUNG ==== */
.mod_register                   { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-50); display: flex; flex-direction: column; align-items: center; }
.mod_register h1.bh             { text-align: center; font-size: clamp(1.75rem, 3vw, 2.5rem); color: var(--portal-primary); margin-bottom: 2rem; }
.mod_register form              { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 2rem 2.5rem; width: 100%; max-width: 560px; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03); }
.mod_register .phone            { display: flex; gap: 0.5rem; }
.mod_register .phone select.select { width: auto; flex-shrink: 0; }
.mod_register .phone input.text { flex: 1; }
.mod_register .pw_input         { display: block; }
.mod_register .pw_input input   { width: 100%; }

/* ==== PORTAL-SECTION ==== */
.portal-section                 { padding: var(--portal-section-py) 1.5rem; background: var(--portal-white); }
.portal-section > .container    { max-width: 1140px; margin-left: auto; margin-right: auto; }
.portal-section--alt            { background: var(--portal-gray-50); }
.portal-section--pale           { background: var(--portal-gray-100); }

/* ==== BTN-PORTAL SOFT (Filter-Tabs) ==== */
.btn-portal--soft               { background: var(--portal-gray-100); color: var(--portal-gray-600); border: none; }
.btn-portal--soft:hover         { background: var(--portal-primary-pale); color: var(--portal-primary); }
.btn-portal--soft.active        { background: var(--portal-primary); color: var(--portal-white); }

/* ==== PORTAL-PROFILE-HEADER (Berater-Profil, kein Bild-Banner) ==== */
.portal-profile-header          { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-50); }
.portal-profile-header .container { max-width: 1140px; margin-left: auto; margin-right: auto; }

/* ==== PORTAL-AVATAR-GROUP (Avatar + Haustier-Overlay) ==== */
.portal-avatar-group            { position: relative; display: inline-block; }
.portal-avatar-pet              { position: absolute; bottom: 0; right: -8px; width: 52px; height: 52px; border-radius: 50%; object-fit: cover; border: 3px solid var(--portal-white); box-shadow: 0 2px 8px rgba(0,0,0,0.1); }

/* ==== CONTAINER ==== */
.container                      { max-width: 1140px; margin-left: auto; margin-right: auto; width: 100%; box-sizing: border-box; }

/* ==== WEITERE UTILITIES ==== */
.col                            { flex: 1 0 0; min-width: 0; }
.col-auto                       { flex: 0 0 auto; width: auto; }
.col-4                          { flex: 0 0 auto; width: calc(33.333% - 0.667rem); }
.g-3                            { gap: 1rem; }
.align-items-center             { align-items: center; }
.align-items-start              { align-items: flex-start; }
.flex-wrap                      { flex-wrap: wrap; }
.d-grid                         { display: grid; }
.justify-content-between        { justify-content: space-between; }
.mt-3                           { margin-top: 1rem; }
.mt-2                           { margin-top: 0.5rem; }
.mt-1                           { margin-top: 0.25rem; }
.mb-1                           { margin-bottom: 0.25rem; }
.mb-2                           { margin-bottom: 0.5rem; }
.pt-3                           { padding-top: 1rem; }
.p-3                            { padding: 1rem; }
.g-5                            { gap: 3rem; }

@media (min-width: 768px) {
.col-md                         { flex: 1 0 0; width: 0; }
.g-md-4                         { gap: 1.5rem; }
.mb-md-4                        { margin-bottom: 1.5rem; }
}

/* ==== STARTSEITE ==== */
.agentlist:not(:has(.profile))   { display: none; }
/* Sicherheitsnetz: falls doch mal .profile.detail auf der Startseite auftaucht */
.cte_text ~ .ajax + .profile.detail               { display: none; }
.cte_text ~ .ajax + .profile.detail ~ .block      { display: none; }
.cte_text ~ .ajax + .profile.detail ~ .cte_tariffs { display: none; }

/* ==== STARTSEITE BERATER-MINI (cte_agent_list_mini.tpl) ==== */
/* Heading aus separatem cte_text.block vor dem Modul */
#main .inside .cte_text:not(.fullwidth):has(+ .portal-berater-home) { background: var(--portal-gray-100); padding: var(--portal-section-py) 1.5rem 0; text-align: center; }
#main .inside .cte_text:not(.fullwidth):has(+ .portal-berater-home) p:first-of-type { font-family: var(--portal-font-display); font-size: clamp(1.75rem, 3vw, 2.5rem); color: var(--portal-primary); margin-bottom: 0.75rem; line-height: 1.25; font-weight: 400; text-align: center; }
#main .inside .cte_text:not(.fullwidth):has(+ .portal-berater-home) p:not(:first-of-type) { font-size: 1.125rem; line-height: 1.75; color: var(--portal-gray-500); max-width: 520px; margin-left: auto; margin-right: auto; margin-bottom: 0; text-align: center; }
#main .inside .cte_text:not(.fullwidth):has(+ .portal-berater-home) .clear { display: none; }
/* Wrapper volle Breite — nur 2rem oben (Abstand nach Überschrift wie im Design) */
.portal-berater-home            { background: var(--portal-gray-100); padding: 2rem 1.5rem var(--portal-section-py); }
/* Grid zentriert, volle Breite des Wrappers */
.portal-berater-home__header    { text-align: center; max-width: 1140px; margin: 0 auto 2.5rem; }
.portal-berater-home__header h2.bh { font-family: var(--portal-font-display); font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); margin-bottom: 0.75rem; }
.portal-berater-home__header p  { font-size: 1.125rem; line-height: 1.75; color: var(--portal-gray-500); max-width: 520px; margin-left: auto; margin-right: auto; }
.portal-berater-home__grid      { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; max-width: 1140px; margin: 0 auto; }

@media (max-width: 767px) {
.portal-berater-home__grid      { grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
}

/* ==== STARTSEITE BERATER-LEISTE (HTML-Block) ==== */
.berater-leiste                 { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-100); }
.berater-leiste__header         { text-align: center; margin-bottom: 2.5rem; }
.berater-leiste__header h2      { font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); margin-bottom: 0.75rem; }
.berater-leiste__header p       { font-size: 1.125rem; line-height: 1.75; color: var(--portal-gray-500); max-width: 520px; margin: 0 auto; }
.berater-leiste__grid           { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; max-width: 1140px; margin: 0 auto; }
.berater-item                   { text-align: center; text-decoration: none; display: block; transition: transform var(--portal-duration) var(--portal-ease); }
.berater-item:hover             { transform: translateY(-3px); }
.berater-item img               { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--portal-card-radius); border: 2px solid var(--portal-gray-200); display: block; transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.berater-item:hover img         { border-color: var(--portal-primary-light); box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.berater-item span              { font-family: var(--portal-font-display); font-size: 0.9375rem; color: var(--portal-gray-700); margin-top: 0.625rem; display: block; }

@media (max-width: 767px) {
.berater-leiste__grid           { grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
}

/* ==== STARTSEITE BERATER-LEISTE (altes Text-Element, Fallback) ==== */
.ce_text.block:has(p > img + img) { padding: var(--portal-section-py) 1.5rem; background: var(--portal-gray-100); }
.ce_text.block:has(p > img + img) h1 { display: none; }
.ce_text.block:has(p > img + img) .clear { display: none; }
.ce_text.block:has(p > img + img) p:nth-of-type(1) { font-family: var(--portal-font-display); font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); text-align: center; margin-bottom: 0.75rem; }
.ce_text.block:has(p > img + img) p:nth-of-type(2) { font-size: 1.125rem; line-height: 1.75; color: var(--portal-gray-500); text-align: center; max-width: 520px; margin: 0 auto 2.5rem; }
.ce_text.block:has(p > img + img) p:nth-of-type(3) { display: none; }
.ce_text.block:has(p > img + img) p:has(img)       { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; max-width: 1140px; margin: 0 auto; }
.ce_text.block:has(p > img + img) p img { width: 100% !important; height: auto !important; aspect-ratio: 1; object-fit: cover; border-radius: var(--portal-card-radius); border: 2px solid var(--portal-gray-200); display: block; transition: transform var(--portal-duration) var(--portal-ease), border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.ce_text.block:has(p > img + img) p img:hover { transform: translateY(-3px); border-color: var(--portal-primary-light); box-shadow: 0 4px 16px rgba(0,0,0,0.08); }

@media (max-width: 767px) {
.ce_text.block:has(p > img + img) p { grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
}

/* ==== HOMEPAGE AGENTLIST (Photo + Name Grid) ==== */
#main .inside:not(:has(.tabnav)) .agentlist { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; max-width: 1140px; margin: 0 auto; padding-bottom: var(--portal-section-py); background: var(--portal-gray-100); }
#main .inside:not(:has(.tabnav)) .agentlist .teaser,
#main .inside:not(:has(.tabnav)) .agentlist .right,
#main .inside:not(:has(.tabnav)) .agentlist .foot,
#main .inside:not(:has(.tabnav)) .agentlist .ddi,
#main .inside:not(:has(.tabnav)) .agentlist .calls { display: none; }
#main .inside:not(:has(.tabnav)) .agentlist .profile { text-align: center; transition: transform var(--portal-duration) var(--portal-ease); }
#main .inside:not(:has(.tabnav)) .agentlist .profile:hover { transform: translateY(-3px); }
#main .inside:not(:has(.tabnav)) .agentlist .left.content { float: none; width: auto; }
#main .inside:not(:has(.tabnav)) .agentlist .profile img.pic { width: 100% !important; height: auto !important; aspect-ratio: 1; object-fit: cover; border-radius: var(--portal-card-radius); border: 2px solid var(--portal-gray-200); display: block; transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
#main .inside:not(:has(.tabnav)) .agentlist .profile:hover img.pic { border-color: var(--portal-primary-light); box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
#main .inside:not(:has(.tabnav)) .agentlist .profile h3 { font-family: var(--portal-font-display); font-size: 0.9375rem; color: var(--portal-gray-700); margin-top: 0.625rem; font-weight: 400; }
#main .inside:not(:has(.tabnav)) .agentlist .profile h3 a { color: inherit; text-decoration: none; }

@media (max-width: 767px) {
#main .inside:not(:has(.tabnav)) .agentlist { grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
}

/* ==== BERATER-LISTING: TEXTBLOCK ÜBER TABNAV ==== */
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700):has(+ ul.tabnav) { text-align: center; padding: 2.5rem 1.5rem 0; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700):has(+ ul.tabnav) h2.bh { font-family: var(--portal-font-display); font-size: clamp(1.625rem, 3vw, 2.25rem); color: var(--portal-primary); }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700):has(+ ul.tabnav) p  { text-align: center; max-width: 580px; margin-left: auto; margin-right: auto; margin-bottom: 0; color: var(--portal-gray-500); font-size: 1.0625rem; line-height: 1.75; }
#main .cte_text:not(.fullwidth):not(.widthlogo):not(.portal-gray-700):has(+ ul.tabnav) .clear { display: none; }

/* ==== BERATER-LISTING: TAB-NAV ==== */
ul.tabnav                       { display: flex; list-style: none; margin: 0 auto; padding: 1rem 1.5rem 1.5rem; max-width: 1140px; gap: 0.5rem; flex-wrap: wrap; justify-content: center; border: none; }
#main ul.tabnav:has(~ .agentlist) { margin-left: auto; margin-right: auto; }
.tabnav li a                    { display: inline-flex; align-items: center; padding: 0.5rem 1.25rem; font-size: 0.8125rem; font-family: var(--portal-font-body); font-weight: 500; border-radius: 100px; border: 1.5px solid var(--portal-gray-300); color: var(--portal-gray-600); text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
.tabnav li a:hover              { border-color: var(--portal-gray-500); color: var(--portal-gray-800); }
.tabnav li.active a,
.tabnav li.verfuegbar a,
.tabnav li.hund a,
.tabnav li.katze a,
.tabnav li.tiermedizin a        { background: var(--portal-primary); color: var(--portal-white); border-color: var(--portal-primary); }

/* ==== BERATER-LISTING: CARD GRID ==== */
.tabnav ~ .agentlist            { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; max-width: 1140px; margin: 2rem auto 0; padding: 0 1.5rem var(--portal-section-py); }
.tabnav ~ .agentlist .profile   { display: flex; flex-direction: column; background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); overflow: hidden; transition: all var(--portal-duration) var(--portal-ease); }
.tabnav ~ .agentlist .profile:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 28px rgba(0,0,0,0.06); transform: translateY(-3px); border-color: var(--portal-gray-300); }

/* Bild (ist jetzt DOM-seitig zuerst — kein order:-1 mehr nötig) */
.tabnav ~ .agentlist .left.content { float: none; width: 100%; position: relative; }
.tabnav ~ .agentlist .left.content > a { display: block; position: relative; padding-top: 100%; overflow: hidden; background: var(--portal-gray-100); }
.tabnav ~ .agentlist .left.content > a > img.pic { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; object-fit: cover; display: block; transition: transform 0.5s var(--portal-ease); }
.tabnav ~ .agentlist .profile:hover img.pic { transform: scale(1.03); }

/* Status-Badge (jetzt HTML-Element, kein ::after mehr) */
.tabnav ~ .agentlist .portal-card__status { position: absolute; top: 0.75rem; left: 0.75rem; z-index: 2; padding: 0.25rem 0.625rem; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; border-radius: 100px; backdrop-filter: blur(8px); }
.tabnav ~ .agentlist .portal-card__status--online { background: rgba(226,239,233,0.92); color: #4a7a66; }
.tabnav ~ .agentlist .portal-card__status--break  { background: rgba(236,234,229,0.92); color: var(--portal-gray-400); }
.tabnav ~ .agentlist .portal-card__status--offline { background: rgba(236,234,229,0.92); color: var(--portal-gray-400); }

/* Bewertung im Listing ausgeblendet */
.tabnav ~ .agentlist .portal-card__meta       { display: none; }

/* Name */
.tabnav ~ .agentlist .profile h3 { padding: 1.25rem 1.25rem 0.25rem; font-size: 1.125rem; color: var(--portal-gray-800); font-family: var(--portal-font-display); font-weight: 400; margin: 0; }
.tabnav ~ .agentlist .profile h3 a { color: inherit; text-decoration: none; transition: color var(--portal-duration) var(--portal-ease); }
.tabnav ~ .agentlist .profile h3 a:hover { color: var(--portal-primary); }

/* Teaser als 2-zeilige Tagline */
.tabnav ~ .agentlist .teaser    { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding: 0.125rem 1.25rem 1rem; font-size: 0.8125rem; color: var(--portal-gray-400); line-height: 1.5; margin: 0; }

/* Ausblenden */
.tabnav ~ .agentlist .ddi,
.tabnav ~ .agentlist .calls,
.tabnav ~ .agentlist .foot      { display: none; }

/* Preis */
.tabnav ~ .agentlist .tariff         { font-size: 0.875rem; font-weight: 600; color: var(--portal-gray-700); }
.tabnav ~ .agentlist .tariff.disable { text-decoration: line-through; color: var(--portal-gray-400); font-weight: 400; font-size: 0.75rem; }
.tabnav ~ .agentlist .tariff.campaign { color: var(--portal-warm); }
.tabnav ~ .agentlist .tariff .asterisk { font-weight: 400; font-size: 0.6875rem; color: var(--portal-gray-400); }

/* Beispiel-Kategorien */
.tabnav ~ .agentlist .portal-card__tags { padding: 0 1.25rem; margin-top: 0.75rem; margin-bottom: 0.75rem; }

/* Footer: Referenz links, Preis rechts */
.tabnav ~ .agentlist .portal-card__footer { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1.25rem; border-top: 1px solid var(--portal-gray-100); margin-top: auto; }
.tabnav ~ .agentlist .portal-card__ref   { font-size: 0.75rem; color: var(--portal-gray-400); transition: color var(--portal-duration) var(--portal-ease); }
.tabnav ~ .agentlist .profile:hover .portal-card__ref { color: var(--portal-primary); }

/* CTA-Button (nur Online) */
.tabnav ~ .agentlist .right.buttons { padding: 0.75rem 1.25rem 1.125rem; }
.tabnav ~ .agentlist .button        { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; font-family: var(--portal-font-body); font-weight: 500; border-radius: 100px; text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
.tabnav ~ .agentlist .button .ico,
.tabnav ~ .agentlist .button .mail,
.tabnav ~ .agentlist .button .phone { display: none; }
.tabnav ~ .agentlist .button.click2call { width: 100%; padding: 0.625rem 1.5rem; font-size: 0.9375rem; background: var(--portal-primary); color: var(--portal-white) !important; }
.tabnav ~ .agentlist .button.click2call:hover { background: var(--portal-gray-700); }
.tabnav ~ .agentlist .button.click2call.remove { background: transparent; color: var(--portal-accent) !important; border: 1.5px solid var(--portal-accent); }
.tabnav ~ .agentlist .button.click2call.remove:hover { background: var(--portal-accent-light); }

/* Preis-Fußnote */
.cte_tariffs                    { max-width: 1140px; margin: 0 auto; padding: 0 1.5rem 2rem; font-size: 0.75rem; color: var(--portal-gray-400); line-height: 1.6; }
.agentlist ~ .cte_tariffs       { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--portal-gray-200); }
.cte_tariffs table              { width: 100%; border-collapse: collapse; margin-top: 0.5rem; }
.cte_tariffs th,
.cte_tariffs td                 { padding: 0.25rem 0.75rem; text-align: left; border-bottom: 1px solid var(--portal-gray-200); font-size: 0.75rem; color: var(--portal-gray-400); }
.cte_tariffs th                 { font-weight: 500; color: var(--portal-gray-500); }

@media (min-width: 992px) {
.tabnav ~ .agentlist            { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1200px) {
.tabnav ~ .agentlist            { grid-template-columns: repeat(4, 1fr); }
}

/* ==== BERATER PROFILSEITE ==== */

/* Äußeres 3-Spalten-Grid: Foto | Inhalt | Sidebar — display:contents auf .profile.detail */
#main .inside:has(.ajax + .profile.detail) { display: grid; grid-template-columns: 180px minmax(0,1fr) 280px; column-gap: 2.5rem; max-width: 1140px; margin: 0 auto; padding: var(--portal-section-py) 1.5rem 0; box-sizing: border-box; align-items: start; }
#ajax-sysmsg                            { grid-column: 1 / -1; height: 0; overflow: hidden; }
.ajax + .profile.detail                 { display: contents; }

/* Foto — rund */
.ajax + .profile.detail > img           { grid-column: 1; grid-row: 2 / span 2; width: 180px; height: 180px; border-radius: 50%; object-fit: cover; border: 4px solid var(--portal-white); box-shadow: 0 4px 20px rgba(0,0,0,0.08); align-self: start; display: block; }

/* Name */
.ajax + .profile.detail > h1            { grid-column: 2; grid-row: 2; font-size: clamp(1.75rem, 3vw, 2.5rem); color: var(--portal-gray-800); margin: 0 0 0.375rem; align-self: end; font-family: var(--portal-font-display); font-weight: 400; }

/* Teaser / Tagline */
.ajax + .profile.detail > .teaser       { grid-column: 2; grid-row: 3; align-self: start; display: flex; flex-direction: column; gap: 0.5rem; padding-bottom: var(--portal-section-py); }
.ajax + .profile.detail .teaser p       { font-size: 1rem; line-height: 1.75; color: var(--portal-gray-500); margin: 0; max-width: 480px; }
.ajax + .profile.detail .teaser .portal-card__tags { margin-bottom: 0; }
.ajax + .profile.detail .teaser .portal-profile-meta { margin-top: 0; gap: 1.25rem; }

/* Sidebar-Karte (Preis + Buttons) */
.ajax + .profile.detail > .right        { grid-column: 3; grid-row: 4 / span 50; align-self: start; background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 1.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03); display: flex; flex-direction: column; gap: 0.75rem; position: sticky; top: 7.5rem; }
.ajax + .profile.detail .right .phone,
.ajax + .profile.detail .right .mail    { display: none; }
.ajax + .profile.detail .right .tariff  { display: block; font-family: var(--portal-font-display); font-size: 1.625rem; color: var(--portal-gray-800); text-align: center; padding-bottom: 1rem; border-bottom: 1px solid var(--portal-gray-200); }
.ajax + .profile.detail .right .tariff .asterisk { font-size: 0.6875rem; font-family: var(--portal-font-body); font-weight: 400; color: var(--portal-gray-400); }
.ajax + .profile.detail .right .button  { display: flex; align-items: center; justify-content: center; gap: 0.5rem; padding: 0.75rem 1.5rem; font-family: var(--portal-font-body); font-size: 0.9375rem; font-weight: 500; border-radius: 100px; text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
.ajax + .profile.detail .right .button.online { background: var(--portal-primary); color: var(--portal-white) !important; }
.ajax + .profile.detail .right .button.online:hover { background: var(--portal-gray-700); }
.ajax + .profile.detail .right .button.email { background: transparent; color: var(--portal-gray-600); border: 1.5px solid var(--portal-gray-300); }
.ajax + .profile.detail .right .button.email:hover { border-color: var(--portal-gray-500); color: var(--portal-gray-800); }
.ajax + .profile.detail .right .button.offline,
.ajax + .profile.detail .right .button.break    { background: transparent; color: var(--portal-gray-600); border: 1.5px solid var(--portal-gray-300); padding: 0.625rem 1.25rem; font-size: 0.875rem; }
.ajax + .profile.detail .right .button.offline:hover,
.ajax + .profile.detail .right .button.break:hover { border-color: var(--portal-gray-500); color: var(--portal-gray-800); }

/* Content-Bereich: "Aktueller Hinweis" + "Profiltext" */
.ajax + .profile.detail ~ .block        { grid-column: 1 / 3; padding: 2.5rem 0 0; background: var(--portal-white); }
.ajax + .profile.detail ~ .block:last-of-type { padding-bottom: var(--portal-section-py); }
.ajax + .profile.detail ~ .block + .block { margin-bottom: 30px; }
.ajax + .profile.detail ~ .block p      { line-height: 1.75; color: var(--portal-gray-600); font-size: 1.0625rem; margin-bottom: 1rem; }
.ajax + .profile.detail ~ .block p:last-child { margin-bottom: 0; }
.ajax + .profile.detail ~ .block .longtext p { font-size: 1.0625rem; }
/* Abschnitts-Überschriften ab 2. Paragraph (Mein Beratungsansatz etc.) */
.ajax + .profile.detail ~ .block .longtext p:not(:first-child)::first-line { font-family: var(--portal-font-display); color: var(--portal-primary); font-weight: 400; }
/* "Mein Tier:" — Heading-Styling für den Bild-Paragraphen */
.ajax + .profile.detail ~ .block .longtext p:has(img) { font-family: var(--portal-font-display); font-size: 1.25rem; color: var(--portal-primary); font-weight: 400; margin-top: 1.75rem; margin-bottom: 0.75rem; }
/* Tier-Fotos: hardcodierte CMS-Attribute (width/height HTML-attrs) mit !important überschreiben */
.ajax + .profile.detail ~ .block .longtext p img { width: 160px !important; height: 160px !important; object-fit: cover; border-radius: var(--portal-card-radius); border: 2px solid var(--portal-gray-100); display: inline-block; vertical-align: top; margin: 0 0.5rem 0.5rem 0; transition: transform var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.ajax + .profile.detail ~ .block .longtext p img:hover { transform: scale(1.03); box-shadow: 0 2px 8px rgba(0,0,0,0.06), 0 8px 28px rgba(0,0,0,0.06); }
/* br:first-child ist global display:none — in Bild-Paragraphen wieder sichtbar damit Bilder auf eigene Zeile kommen */
.ajax + .profile.detail ~ .block .longtext p:has(img) > br:first-child { display: inline; }

/* Kurzinfo — Notice-Stil */
.ajax + .profile.detail ~ .block.pnotice { background: var(--portal-white); border-left: 3px solid var(--portal-primary-light); padding-left: 1rem; }
.ajax + .profile.detail ~ .block.pnotice h2.bh { font-family: var(--portal-font-body); font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--portal-gray-400); margin-bottom: 0.5rem; }
.ajax + .profile.detail ~ .block.pnotice p { font-style: italic; color: var(--portal-gray-700); font-family: var(--portal-font-display); font-size: 1.0625rem; margin-bottom: 0.75rem; }
.ajax + .profile.detail ~ .block.pnotice .portal-card__tags { margin-top: 0.25rem; margin-bottom: 0; }
.ajax + .profile.detail ~ .block.pnotice .portal-tag { font-size: 0.8125rem; padding: 0.3125rem 0.75rem; text-decoration: none; }

/* Section-Titel — gleicher Stil wie "Mein Tier:" */
.ajax + .profile.detail ~ .block h2.bh  { font-family: var(--portal-font-display); font-size: 1.25rem; color: var(--portal-primary); font-weight: 400; margin-bottom: 1rem; text-transform: none; letter-spacing: 0; }

/* Preis-Tabelle auf Profilseite ausblenden (Preis ist in Sidebar) */
.ajax + .profile.detail ~ .cte_tariffs  { display: none; }

/* Sidebar: Status-Badge (neu im Template) */
.ajax + .profile.detail .teaser .portal-card__status { position: static; margin-bottom: 0; display: inline-flex; align-self: flex-start; }

/* Sidebar: Spenden-Hinweis */
.ajax + .profile.detail .right .portal-sidebar-hint { background: var(--portal-primary-pale); border-radius: 0.5rem; padding: 0.625rem 0.75rem; font-size: 0.75rem; color: #4a7a66; font-weight: 500; text-align: center; }

/* Sidebar: Status-Indikator */
.ajax + .profile.detail .right .portal-sidebar-status { display: flex; align-items: center; justify-content: center; gap: 0.5rem; font-size: 0.875rem; color: var(--portal-gray-600); font-weight: 500; }
.ajax + .profile.detail .right .portal-sidebar-status__dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.ajax + .profile.detail .right .portal-sidebar-status--online .portal-sidebar-status__dot { background: #4a7a66; animation: pulse-dot 2s infinite; }
.ajax + .profile.detail .right .portal-sidebar-status--break .portal-sidebar-status__dot,
.ajax + .profile.detail .right .portal-sidebar-status--offline .portal-sidebar-status__dot { background: var(--portal-gray-300); }

/* Sidebar: SSL-Hinweis */
.ajax + .profile.detail .right .portal-sidebar-ssl { font-size: 0.75rem; color: var(--portal-gray-400); text-align: center; border-top: 1px solid var(--portal-gray-200); padding-top: 0.75rem; margin-top: 0.25rem; }

/* Bewertungen */
.ajax + .profile.detail ~ .ratings      { padding-bottom: var(--portal-section-py) !important; }
.ajax + .profile.detail ~ .ratings .portal-review { border-bottom: 1px solid var(--portal-gray-100); padding: 1.25rem 0; }
.ajax + .profile.detail ~ .ratings .portal-review:last-of-type { border-bottom: none; }
.portal-review__reply           { font-size: 0.875rem; color: var(--portal-gray-500); background: var(--portal-gray-50); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-top: 0.75rem; }

/* Beratungskategorien */
.ajax + .profile.detail ~ .cats-block   { grid-column: 1 / 3; padding: 2.5rem 0 0; background: var(--portal-white); }
.ajax + .profile.detail ~ .cats-block h2.bh { font-family: var(--portal-font-display); font-size: 1.25rem; color: var(--portal-primary); font-weight: 400; text-transform: none; letter-spacing: 0; margin-bottom: 0.75rem; }
.ajax + .profile.detail ~ .cats-block .d-flex { display: flex; flex-wrap: wrap; gap: 0.625rem; margin-top: 0.75rem; }
.ajax + .profile.detail ~ .cats-block .portal-tag { padding: 0.5rem 1rem; font-size: 0.8125rem; text-decoration: none; }
/* Andere Content-Geschwister */
.ajax + .profile.detail ~ .portal-profile-sections { grid-column: 1 / 3; background: var(--portal-white); }
.ajax + .profile.detail ~ .ratings      { grid-column: 1 / 3; padding: 2.5rem 0 var(--portal-section-py) !important; background: var(--portal-white); }
.ajax + .profile.detail ~ .available-block,
.ajax + .profile.detail ~ .bundles-block { grid-column: 1 / 3; padding: 2.5rem 0 0; background: var(--portal-white); }
/* Lazy-load Bilder — Platzhalter sichtbar bis JS geladen */
.ajax + .profile.detail ~ .block .longtext p img[src*="pixel.gif"] { background: var(--portal-gray-100); }

/* Verfügbarkeit */
.portal-availability-list       { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.375rem; }
.portal-availability-list li    { font-size: 0.9375rem; color: var(--portal-gray-600); }

/* Minutenpakete */
.portal-bundles                 { display: flex; flex-direction: column; gap: 0.75rem; }
.portal-bundle-row              { display: flex; align-items: center; gap: 1.5rem; padding: 0.875rem 1.25rem; background: var(--portal-gray-50); border-radius: 0.75rem; }
.portal-bundle-minutes          { font-weight: 600; color: var(--portal-gray-800); min-width: 80px; }
.portal-bundle-price            { color: var(--portal-gray-700); min-width: 80px; }
.portal-bundle-saving           { color: var(--portal-primary); font-weight: 600; font-size: 0.875rem; min-width: 50px; }
.portal-bundle-action           { margin-left: auto; }

@media (max-width: 991px) {
#main .inside:has(.ajax + .profile.detail) { display: block; padding: 0; max-width: none; margin: 0; background: transparent; }
#ajax-sysmsg                            { height: auto; }
.ajax + .profile.detail                 { display: grid; padding: var(--portal-section-py) 1.5rem; grid-template-areas: "photo name" "teaser teaser" "sidebar sidebar"; grid-template-columns: auto 1fr; grid-template-rows: auto; gap: 0 2rem; max-width: 1140px; margin: 0 auto; }
.ajax + .profile.detail > img           { grid-area: photo; width: 180px; height: 180px; }
.ajax + .profile.detail > h1            { grid-area: name; }
.ajax + .profile.detail > .teaser       { grid-area: teaser; padding-bottom: 0; }
.ajax + .profile.detail > .right        { grid-area: sidebar; position: static; }
.ajax + .profile.detail ~ .block,
.ajax + .profile.detail ~ .cats-block,
.ajax + .profile.detail ~ .portal-profile-sections,
.ajax + .profile.detail ~ .ratings,
.ajax + .profile.detail ~ .available-block,
.ajax + .profile.detail ~ .bundles-block { padding: 2.5rem 1.5rem 0; max-width: 1140px; margin-left: auto; margin-right: auto; }
.ajax + .profile.detail ~ .block:last-of-type { padding-bottom: var(--portal-section-py); }
}
@media (max-width: 575px) {
.ajax + .profile.detail                 { grid-template-columns: 100px 1fr; gap: 0 1.5rem; }
.ajax + .profile.detail > img           { width: 100px; height: 100px; }
.ajax + .profile.detail > h1            { font-size: 1.5rem; }
}
@media (max-width: 575px) {
.ajax + .profile.detail                 { grid-template-columns: 100px 1fr; gap: 0 1.5rem; }
.ajax + .profile.detail > img           { width: 100px; height: 100px; }
.ajax + .profile.detail h1              { font-size: 1.5rem; }
}

/* ==== BERATERBEREICH — FOUNDATION ==== */
body:has(#header .nav ul.level_2) #main { background: var(--portal-gray-50); }

/* .inside padding nur auf Member-Area-Seiten (Modul-Klassen existieren nur dort) */
body:has(#header .nav ul.level_2) #main .inside:has(.mod_statistic,.mod_status,.mod_pm,.mod_customers,.mod_logout,.mod_avatar,.mod_phone_create,.mod_campaign,.mod_callback,.mod_categories,.mod_consultations,.mod_onlinetime,.mod_invoice,.mod_favorites,.mod_recharge) { padding: 1.5rem 1.5rem 3rem; }

/* Karten-Stil für alle Member-Area-Blöcke */
.mod_statistic, .mod_status, .mod_phone_create, .mod_campaign, .mod_pm, .mod_logout, .mod_customers, .mod_avatar, .mod_callback, .mod_categories, .mod_consultations, .mod_onlinetime, .mod_invoice, .mod_favorites, .mod_recharge, .cte_account { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 1.75rem 2rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03); max-width: 1140px; margin: 0 auto 1.5rem; }

/* Seiten-Titel in Member-Area-Blöcken */
.mod_statistic h1.bh, .mod_status h1.bh, .mod_phone_create h1.bh, .mod_campaign h1.bh, .mod_pm h1.bh, .mod_logout h1.bh, .mod_customers h1.bh, .mod_avatar h1.bh, .mod_callback h1.bh, .mod_categories h1.bh, .mod_consultations h1.bh, .mod_onlinetime h1.bh, .mod_invoice h1.bh, .mod_favorites h1.bh, .mod_recharge h1.bh { font-size: clamp(1.375rem, 3vw, 1.875rem); color: var(--portal-gray-800); margin: 0 0 1.5rem; letter-spacing: -0.01em; }

/* ==== GENERIC FORM EXTENSIONS (Beraterbereich) ==== */
.block form textarea, textarea.textarea { width: 100%; padding: 0.75rem 1rem; font-family: var(--portal-font-body); font-size: 1rem; color: var(--portal-gray-800); background: var(--portal-gray-50); border: 1.5px solid var(--portal-gray-200); border-radius: 0.5rem; outline: none; box-sizing: border-box; resize: vertical; min-height: 120px; transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.block form textarea:focus, textarea.textarea:focus { border-color: var(--portal-primary-light); box-shadow: 0 0 0 3px var(--portal-primary-pale); background: var(--portal-white); }

/* Radio-Buttons als Pill-Gruppe */
.block form input[type="radio"].radio   { position: absolute; opacity: 0; pointer-events: none; }
.block form input[type="radio"].radio + label { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.375rem 1rem; font-size: 0.875rem; border: 1.5px solid var(--portal-gray-200); border-radius: 100px; cursor: pointer; color: var(--portal-gray-500); transition: all var(--portal-duration) var(--portal-ease); margin: 0 0.5rem 0.5rem 0; font-family: var(--portal-font-body); }
.block form input[type="radio"].radio + label::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--portal-gray-300); flex-shrink: 0; transition: background var(--portal-duration) var(--portal-ease); }
.block form input[type="radio"].radio:checked + label { border-color: var(--portal-primary); background: var(--portal-primary-pale); color: var(--portal-primary); }
.block form input[type="radio"].radio:checked + label::before { background: var(--portal-primary); }

/* Währungs-Label neben Inputs */
.block form span.input_curr             { font-size: 0.8125rem; color: var(--portal-gray-400); }

/* Telefon: Ländervorwahl + Nummer nebeneinander */
.block form .phone                      { display: flex; gap: 0.5rem; }
.block form .phone .select              { width: auto; flex-shrink: 0; }
.mod_phone_create form .row:has(.phone) { align-items: flex-start; }
.mod_phone_create form .phone           { display: grid; grid-template-columns: minmax(96px, 140px) minmax(0, 1fr); gap: 0.5rem; width: min(100%, 520px); }
.mod_phone_create form .phone select.select { width: 100%; min-width: 0; }
.mod_phone_create form .phone input.text { width: 100%; min-width: 0; box-sizing: border-box; }

/* Tarif-Zeile: Label + Input + Währung inline */
.block form .row.form_tariff            { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.block form .row.form_tariff label      { min-width: 200px; flex-shrink: 0; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.04em; margin-bottom: 0; }
.block form .row.form_tariff input.text { max-width: 160px; }

/* ==== LINK-BUTTONS (a.button — Member Area) ==== */
a.button                                { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1.25rem; font-family: var(--portal-font-body); font-size: 0.8125rem; font-weight: 500; border-radius: 100px; border: 1.5px solid var(--portal-gray-300); color: var(--portal-gray-600); text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
a.button:hover                          { border-color: var(--portal-gray-500); color: var(--portal-gray-800); }
a.button.create                         { background: var(--portal-primary); color: var(--portal-white) !important; border-color: var(--portal-primary); }
a.button.create:hover                   { background: var(--portal-gray-700); border-color: var(--portal-gray-700); }
a.button.inactive                       { opacity: 0.4; pointer-events: none; }

/* ==== GENERIC TABELLEN (Member Area) ==== */
#main .table table                      { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
#main .table table th                   { padding: 0.5rem 0.875rem; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--portal-gray-500); background: var(--portal-gray-50); border-bottom: 2px solid var(--portal-gray-200); text-align: left; white-space: nowrap; }
#main .table table td                   { padding: 0.75rem 0.875rem; color: var(--portal-gray-600); border-bottom: 1px solid var(--portal-gray-100); vertical-align: middle; }
#main .table table tr.even td           { background: var(--portal-gray-50); }
#main .table table td.right, #main .table table th.right { text-align: right; }
#main .table table td.gray              { color: var(--portal-gray-400); font-size: 0.875rem; }
#main .table table td.first, #main .table table th.first { padding-left: 1.25rem; }
#main .table table td.last, #main .table table th.last  { padding-right: 1.25rem; }

/* ==== HOME: mod_statistic (Umsatzstatistik) ==== */
.mod_statistic .table table td:not(.gray) { font-weight: 600; color: var(--portal-gray-700); }

/* ==== HOME: mod_logout (Status-Widget auf /login) ==== */
.mod_logout h2.bh                       { display: none; }
.mod_logout ul.infos                    { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: 0.625rem 2rem; }
.mod_logout ul.infos li                 { font-size: 0.9375rem; color: var(--portal-gray-600); display: flex; align-items: center; gap: 0.5rem; }
.mod_logout ul.infos li.icon.user       { font-family: var(--portal-font-display); color: var(--portal-gray-800); font-size: 1.125rem; }
.mod_logout ul.infos li.icon.status::before { content: ''; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.mod_logout ul.infos li.icon.status.s0  { color: var(--portal-gray-400); }
.mod_logout ul.infos li.icon.status.s0::before { background: var(--portal-gray-300); }
.mod_logout ul.infos li.icon.status.s2  { color: #4a7a66; }
.mod_logout ul.infos li.icon.status.s2::before { background: #4a7a66; animation: pulse-dot 2s infinite; }
.mod_logout ul.infos li.icon.mail a     { color: var(--portal-primary); font-weight: 500; }
.mod_logout form                        { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--portal-gray-100); }
.mod_logout form input.submit           { width: auto; padding: 0.5rem 1.5rem; font-size: 0.875rem; background: var(--portal-gray-600); border-radius: 100px; }
.mod_logout form input.submit:hover     { background: var(--portal-gray-800); transform: none; box-shadow: none; }
a.submit.callmonitor                    { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.375rem 1.1rem; border-radius: 100px; border: 1.5px solid var(--portal-gray-300); font-size: 0.875rem; color: var(--portal-gray-600); text-decoration: none; transition: all var(--portal-duration) var(--portal-ease); }
a.submit.callmonitor:hover              { border-color: var(--portal-primary-light); color: var(--portal-primary); }

/* Leere Seiten-Meldungen */
.mod_campaign > p, .mod_callback > p, .mod_invoice > p, .mod_consultations > p { font-size: 0.9375rem; color: var(--portal-gray-400); font-style: italic; margin: 0; }

/* ==== MEINE KUNDEN ==== */
.mod_customers .right                   { display: flex; justify-content: flex-end; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.mod_customers form .search             { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; }
.mod_customers form .search input.text  { flex: 1 1 auto; width: auto; min-width: 120px; }
.mod_customers .tabnav                  { clear: both; }
.mod_customers > p                      { font-size: 0.9375rem; color: var(--portal-gray-400); font-style: italic; margin: 1rem 0 0; }

/* ==== BERATUNGSKATEGORIEN ==== */
.mod_categories ul.level_1             { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-direction: column; gap: 0; }
.mod_categories ul.level_1 > li        { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0.875rem; border-radius: 0.5rem; transition: background var(--portal-duration) var(--portal-ease); font-size: 0.9375rem; color: var(--portal-gray-700); }
.mod_categories ul.level_1 > li:hover  { background: var(--portal-gray-50); }
.mod_categories ul.level_1 li input[type="checkbox"] { width: 16px; height: 16px; flex-shrink: 0; accent-color: var(--portal-primary); cursor: pointer; margin: 0; }
.mod_categories ul.level_1 li i        { color: var(--portal-gray-300); cursor: grab; font-size: 0.875rem; }
.mod_categories ul.level_2             { list-style: none; padding: 0 0 0 2.5rem; margin: 0; display: flex; flex-direction: column; }
.mod_categories ul.level_2.hide        { display: none !important; }

/* ==== BERATERPROFIL — Textarea-Wrapper + Rich Text Editor ==== */
/* Überschreibt CMS-Regel: #main .textdiv { display: inline-block } */
#main .block form .textdiv              { display: block; width: 100%; }
.flex_editor                            { border: 1.5px solid var(--portal-gray-200); border-radius: 0.5rem; overflow: hidden; transition: border-color var(--portal-duration) var(--portal-ease); }
.flex_editor:focus-within               { border-color: var(--portal-primary-light); }
.flex_editor .fx_bar                    { display: flex; align-items: center; gap: 0.125rem; padding: 0.375rem 0.5rem; background: var(--portal-gray-50); border-bottom: 1px solid var(--portal-gray-200); flex-wrap: wrap; }
.flex_editor .fx_bar i                  { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; font-size: 0.875rem; color: var(--portal-gray-500); cursor: pointer; transition: all var(--portal-duration) var(--portal-ease); }
.flex_editor .fx_bar i:hover            { background: var(--portal-gray-200); color: var(--portal-gray-800); }
.flex_editor > div:not(.fx_bar)        { min-height: 160px; padding: 0.875rem 1rem; font-family: var(--portal-font-body); font-size: 1rem; color: var(--portal-gray-700); line-height: 1.6; outline: none; }

/* ==== ZEITRAUM-SELEKTOR (Beratungen, Onlinezeit) ==== */
.block form select[name="time"]         { width: auto; min-width: 180px; margin-bottom: 1rem; }

/* ==== DISABLED INPUTS ==== */
.block form input:disabled              { background: var(--portal-gray-100) !important; color: var(--portal-gray-400); cursor: not-allowed; }

/* ==== SUBMIT-BUTTONS — zentriert + auto-width (überschreibt width:100% global) ==== */
/* Gleiche Spezifität (0,2,2) wie .block form input.submit — aber später = gewinnt */
.cte_account form input.submit,
.mod_status form input.submit,
.mod_phone_create form input.submit,
.mod_categories form input.submit       { width: auto; display: block; margin: 1.5rem auto 0; min-width: 220px; padding: 0.75rem 2.5rem; }

/* ==== MODAL #window "Unvollständige Angaben" ==== */
/* Card-Stil im Modal-Kontext entfernen */
#window .cte_account                    { background: transparent; border: none; border-radius: 0; padding: 0; box-shadow: none; margin: 0; max-width: none; }
/* 2-Spalten-Grid: alle .row-Felder nebeneinander */
#window form                            { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem 1.25rem; align-items: start; }
#window form .row                       { margin-bottom: 0; }
/* Checkbox-Zeilen + Submit über beide Spalten */
#window form .row.check,
#window form input.submit               { grid-column: 1 / -1; }
/* Kompaktere Inputs */
#window form input.text,
#window form select.select              { padding: 0.5rem 0.75rem; font-size: 0.875rem; }
#window form label                      { font-size: 0.75rem; margin-bottom: 0.25rem; }
/* Submit im Modal zentriert */
#window form input.submit               { width: auto; display: block; margin: 0.75rem auto 0; min-width: 200px; padding: 0.625rem 2rem; }

/* ==== NACHRICHTEN — Arbeitsbereich ==== */
.mod_pm                               { overflow: hidden; }
.mod_pm h1.bh                         { margin-bottom: 1rem; }
.mod_pm .clear                        { clear: both; display: block; height: 0; overflow: hidden; }
.mod_pm input.text.search             { float: left; margin: 0 0.75rem 0 0; padding: 0.55rem 1rem; border: 1.5px solid var(--portal-gray-300); border-radius: 100px; background: var(--portal-white); font-size: 0.875rem; color: var(--portal-gray-600); outline: none; font-family: var(--portal-font-body); transition: border-color var(--portal-duration) var(--portal-ease), box-shadow var(--portal-duration) var(--portal-ease); }
.mod_pm input.text.search:focus       { border-color: var(--portal-primary-light); box-shadow: 0 0 0 3px var(--portal-primary-pale); }
.mod_pm input.text.search::placeholder { color: var(--portal-gray-400); }
.mod_pm a.button.create,
.mod_pm a.button.write_msg            { float: left; display: inline-flex; align-items: center; justify-content: center; min-height: 20px; padding: 0.55rem 1.25rem; font-size: 0.875rem; background: var(--portal-primary); color: var(--portal-white) !important; border-color: var(--portal-primary); }
.mod_pm a.button.create:hover,
.mod_pm a.button.write_msg:hover      { background: var(--portal-gray-700); border-color: var(--portal-gray-700); color: var(--portal-white) !important; }

/* ==== NACHRICHTEN — Tabs und Tabelle ==== */
.mod_pm .tabnav                       { clear: both; padding: 1.25rem 0 0; margin: 0; max-width: none; justify-content: flex-start; gap: 0.25rem; }
.mod_pm .tabnav li a                  { border-radius: 0.5rem 0.5rem 0 0; padding: 0.5rem 1rem; border: 1.5px solid transparent; border-bottom: none; font-size: 0.8125rem; }
.mod_pm .tabnav li.active a           { background: var(--portal-white); color: var(--portal-primary); border-color: var(--portal-primary-light); border-bottom-color: var(--portal-white); margin-bottom: -2px; box-shadow: 0 -2px 10px rgba(122,158,142,0.08); }
.mod_pm .tabnav li a:hover            { background: var(--portal-gray-50); color: var(--portal-gray-800); }
.mod_pm #result, .mod_pm .table       { clear: both; margin-top: 1rem; }
.mod_pm .table                        { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 0.25rem; }
.mod_pm .table table                  { min-width: 760px; }
.mod_pm .table table th,
.mod_pm .table table td               { white-space: nowrap; }
.mod_pm .table table td:first-child   { white-space: normal; min-width: 220px; }

/* ==== NACHRICHTEN — tfoot "Auswahl löschen" als Action-Bar ==== */
#main .table table tfoot tr td          { background: var(--portal-gray-50); border-top: 1px solid var(--portal-gray-200); padding: 0.625rem 0.875rem; font-size: 0.8125rem; color: var(--portal-gray-400); }
#main .table table tfoot tr td.last     { color: var(--portal-gray-500); }
#main .table table tfoot a.delete_all   { font-size: 0.8125rem; color: var(--portal-gray-400); display: inline-flex; align-items: center; gap: 0.375rem; transition: color var(--portal-duration) var(--portal-ease); }
#main .table table tfoot a.delete_all::before { content: '✕'; font-size: 0.6875rem; }
#main .table table tfoot a.delete_all:hover { color: var(--portal-accent); }

/* ==== MEINE KUNDEN — Tabnav-Separator + Suchfeld Pill ==== */
.mod_customers .tabnav, .mod_onlinetime .tabnav { padding: 0; margin: 1.25rem 0 0; max-width: none; justify-content: flex-start; gap: 0.25rem; }
.mod_customers .tabnav li a, .mod_onlinetime .tabnav li a { border-radius: 0.5rem 0.5rem 0 0; padding: 0.4rem 1rem; border: 1.5px solid transparent; border-bottom: none; font-size: 0.8125rem; }
.mod_customers .tabnav li.active a, .mod_onlinetime .tabnav li.active a { background: var(--portal-primary-pale); color: var(--portal-primary); border-color: var(--portal-primary-light); border-bottom-color: var(--portal-white); margin-bottom: -2px; }
.mod_customers .tabnav li a:hover, .mod_onlinetime .tabnav li a:hover { background: var(--portal-gray-50); color: var(--portal-gray-800); }
.mod_customers #result, .mod_onlinetime .table { margin-top: 1rem; }
/* Suchfeld Pill */
.mod_customers form .search input.text  { border: 1.5px solid var(--portal-gray-300); border-radius: 100px; background: transparent; padding: 0.4rem 1rem; font-size: 0.875rem; color: var(--portal-gray-600); outline: none; font-family: var(--portal-font-body); transition: border-color var(--portal-duration) var(--portal-ease), background var(--portal-duration) var(--portal-ease); }
.mod_customers form .search input.text:focus { border-color: var(--portal-primary-light); background: var(--portal-white); box-shadow: 0 0 0 3px var(--portal-primary-pale); }
#wrapper #main .mod_customers form .search input.submit { width: auto; padding: calc(0.4rem + 1.5px) 1.5rem; font-size: 0.875rem; min-width: 80px; margin: 0; border-radius: 100px; line-height: normal; }
#wrapper #main .mod_customers form .search input.submit:hover { background: var(--portal-gray-700); }

/* ==== ONLINESTATUS — Checkbox "Aktionstarif" inline ==== */
/* div.check im CMS hat display:block — überschreiben */
.block form div.check                   { display: flex; align-items: center; gap: 0.625rem; margin: 0.875rem 0; }
.block form div.check label             { text-transform: none; letter-spacing: 0; font-size: 0.875rem; font-weight: 400; color: var(--portal-gray-600); margin-bottom: 0; cursor: pointer; }
.block form div.check input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--portal-primary); cursor: pointer; flex-shrink: 0; margin: 0; }

/* ==== KUNDEN-HOME — Generischer Guthaben-Block ==== */
/* div[class="block"] hat exakt nur class="block" — sehr spezifisch, trifft nur diesen Block */
body:has(#header .nav ul.level_2) #main .inside > div[class="block"] { background: var(--portal-white); border: 1px solid var(--portal-gray-200); border-radius: var(--portal-card-radius); padding: 1.75rem 2rem; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03); max-width: 1140px; margin: 0 auto 1.5rem; }
body:has(#header .nav ul.level_2) #main .inside > div[class="block"] h2.bh { font-size: 1.125rem; color: var(--portal-primary); margin-bottom: 1rem; }
body:has(#header .nav ul.level_2) #main .inside > div[class="block"] > p   { font-size: 1rem; color: var(--portal-gray-600); margin-bottom: 1rem; }

/* ==== KUNDEN-FAVORITEN ==== */
.mod_favorites ul.favorites             { list-style: none; padding: 0; margin: 0; }
.mod_favorites ul.favorites:empty::after { content: 'Noch keine Favoriten gespeichert.'; display: block; font-size: 0.9375rem; color: var(--portal-gray-400); font-style: italic; }

/* ==== KUNDEN GUTHABEN AUFLADEN ==== */
.mod_recharge > p                       { font-size: 0.9375rem; color: var(--portal-gray-500); margin-bottom: 1.5rem; padding: 0.75rem 1rem; background: var(--portal-warm-light); border-radius: 0.5rem; border-left: 3px solid var(--portal-warm); }
.mod_recharge .formbox.payment          { display: flex; flex-direction: column; align-items: flex-start; gap: 0.625rem; max-width: 520px; margin-bottom: 30px; }

.mod_recharge .formbox.payment > a img,
.mod_recharge .formbox.payment > a svg  { width: 56px; max-width: 56px; height: 34px; object-fit: contain; justify-self: center; align-self: center; padding: 0.25rem 0.375rem; background: var(--portal-gray-50); border: 1px solid var(--portal-gray-100); border-radius: 0.5rem; box-sizing: border-box; }
.mod_recharge .formbox.payment > a > span { min-width: 0; }
.mod_recharge h3                        { font-family: var(--portal-font-body); font-size: 0.8125rem; font-weight: 600; color: var(--portal-gray-600); margin: 0.125rem 0 0; }
.mod_recharge .formbox.payment > p      { font-size: 0.8125rem; color: var(--portal-gray-400); line-height: 1.5; margin: 0; }
.mod_recharge .formbox form             { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-top: 0.25rem; }
.mod_recharge .formbox form select.select { width: auto; min-width: 100px; }
.mod_recharge .formbox button.submit    { display: inline-flex; align-items: center; justify-content: center; width: auto; min-width: 130px; padding: 0.5rem 1.25rem; font-family: var(--portal-font-body); font-size: 0.875rem; font-weight: 500; background: var(--portal-primary); color: var(--portal-white); border: none; border-radius: 100px; cursor: pointer; transition: background var(--portal-duration) var(--portal-ease); }
.mod_recharge .formbox button.submit:hover { background: var(--portal-gray-700); }