@layer od-layout {
  :where(.od-stack,.od-row,.od-row-top,.od-cluster,.od-grid,.od-field,.od-stat,.od-cell,.od-tile) > :where(*) { min-width: 0; }
  .od-stack   { display: flex; flex-direction: column; gap: var(--od-gap, 8px); }
  .od-row     { display: flex; align-items: center; gap: var(--od-gap, 8px); }
  .od-row-top { display: flex; align-items: flex-start; gap: var(--od-gap, 8px); }
  .od-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--od-gap, 8px); }
  .od-fill    { flex: 1 1 0; min-width: 0; }
  .od-fixed   { flex: none; }
  .od-grid    { display: grid; gap: var(--od-gap, 12px); grid-template-columns: repeat(var(--od-cols, 3), minmax(0, 1fr)); }
  .od-stat, .od-field, .od-cell { display: grid; gap: var(--od-gap, 2px); }
  :where(.od-stat,.od-field,.od-cell) > :where(*) { display: block; }
  .od-tile { display: grid; grid-template-rows: auto 1fr; }
  :where(.od-tile) > :where(*) { display: block; }
  .od-media { display: block; width: 100%; height: auto; aspect-ratio: var(--od-ratio, auto); }
  .od-media-cover { object-fit: cover; }
  .od-truncate { display: block; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .od-clamp-2, .od-clamp-3 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
  .od-clamp-2 { -webkit-line-clamp: 2; }
  .od-clamp-3 { -webkit-line-clamp: 3; }
  .od-lines-2 { min-height: calc(2 * 1.4em); }
  .od-nowrap  { white-space: nowrap; }
  .od-keep    { word-break: keep-all; overflow-wrap: anywhere; }
  .od-screen { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100%; }
  .od-scroll { overflow-y: auto; overscroll-behavior: contain; min-height: 0; }
  .od-rail { display: flex; gap: var(--od-gap, 8px); overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
             padding-inline: var(--od-rail-pad, 16px); scroll-padding-inline: var(--od-rail-pad, 16px); }
  .od-rail::-webkit-scrollbar { display: none; }
  :where(.od-rail) > :where(*) { flex: none; scroll-snap-align: start; }
  :where(.od-rail) > :where(:last-child) { margin-inline-end: var(--od-rail-pad, 16px); }
  .od-spacer { flex: none; visibility: hidden; pointer-events: none; }
  .od-touch  { min-width: 44px; min-height: 44px; }
}
/* /OD-LAYOUT-PRIMITIVES v1 */

:root{
  --c-primary:#595A5C;
  --c-graphite:#2B2C2E;
  --c-accent:#D97706;
  --c-white:#FFFFFF;
  --c-bg-alt:#F4F6F8;
  --c-ink:#1B1C1E;
  --c-ok:#10B981;
  --c-warn:#F59E0B;
  --c-muted:#6B7280;
  --c-line:#E2E6EA;

  --font-display:'Plus Jakarta Sans','Segoe UI',system-ui,-apple-system,sans-serif;
  --font-body:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;

  --fs-h1:clamp(2rem,4.6vw,3.5rem);
  --fs-h2:clamp(1.5rem,3vw,2.25rem);
  --fs-h3:clamp(1.125rem,1.6vw,1.375rem);
  --fs-body:1rem;
  --fs-small:0.875rem;

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px;

  --radius:0px; --radius-sm:0px; --radius-lg:0px;
  --shadow:0 6px 24px rgba(43,44,46,.08);
  --shadow-sm:0 2px 8px rgba(43,44,46,.06);

  --dur:200ms; --dur-fast:150ms; --ease:cubic-bezier(.22,.61,.36,1);
  --maxw:1200px; --header-h:118px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:176px}
body{
  margin:0; background:var(--c-white); color:var(--c-graphite);
  font-family:var(--font-body); font-size:var(--fs-body); line-height:1.6;
  -webkit-font-smoothing:antialiased; min-height:100vh;
}
img{max-width:100%}
h1,h2,h3,h4{font-family:var(--font-display); color:var(--c-graphite); line-height:1.15; margin:0 0 var(--sp-3)}
h1{font-size:var(--fs-h1); font-weight:800; letter-spacing:-.01em}
h2{font-size:var(--fs-h2); font-weight:800}
h3{font-size:var(--fs-h3); font-weight:700}
p{margin:0 0 var(--sp-4)}
a{color:var(--c-graphite)}
.eyebrow{
  font-family:var(--font-display); font-weight:700; font-size:var(--fs-small);
  text-transform:uppercase; letter-spacing:.14em; color:#B45309;
  margin:0 0 var(--sp-3);
}
.lead{font-size:1.0625rem; color:var(--c-primary); max-width:70ch}
.lead--desc{max-width:none}
.container{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:20px}
.section{padding-block:var(--sp-8)}
.section--alt{background:var(--c-bg-alt)}
.section-head{max-width:70ch; margin-bottom:var(--sp-6)}
.visually-hidden{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

.skip-link{
  position:absolute; left:16px; top:-60px; z-index:200; background:var(--c-graphite); color:#fff;
  padding:10px 16px; border-radius:var(--radius-sm); text-decoration:none; transition:top var(--dur-fast) var(--ease);
}
.skip-link:focus{top:12px}

:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--c-accent); outline-offset:2px; border-radius:0;
}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--sp-2);
  min-height:48px; padding:12px 22px; border-radius:var(--radius-sm);
  font-family:var(--font-display); font-weight:700; font-size:.95rem; line-height:1.2;
  text-decoration:none; cursor:pointer; border:2px solid transparent;
  transition:background-color var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur-fast) var(--ease);
}
.btn--primary{background:var(--c-graphite); color:#fff; border-color:var(--c-graphite)}
.btn--primary:hover{background:var(--c-accent); color:#16171A; border-color:var(--c-accent)}
.btn--ghost{background:transparent; color:var(--c-graphite); border-color:var(--c-graphite)}
.btn--ghost:hover{background:var(--c-graphite); color:#fff}
.btn--light{background:#fff; color:var(--c-graphite); border-color:#fff}
.btn--light:hover{background:var(--c-accent); color:#16171A; border-color:var(--c-accent)}
.es-wa-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 12px 22px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: .95rem;
  line-height: 1.2;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color var(--dur) var(--ease), transform var(--dur-fast) var(--ease), box-shadow var(--dur) var(--ease);
}
.es-wa-btn--whatsapp{background-color: #25D366; color: #fff}
.es-wa-btn--whatsapp:hover{background-color: #1EB955; box-shadow: 0 6px 16px -8px rgba(37,211,102,.7)}
.es-wa-btn:active{transform: translateY(1px)}
.es-wa-btn svg{width: 19px; height: 19px; flex: none}
/* Buttons füllen die Aktion-Zeile gleichmäßig – keine toten Flächen. */
.request-form .apply-actions > .btn,
.request-form .apply-actions > .es-wa-btn{flex:1 1 240px; min-width:0}
/* Direkt-anfragen-Karte: gestapelt, volle Breite. */
.filter-card .apply-actions{flex-direction:column; align-items:stretch; gap:10px}
.filter-card .apply-actions > .btn,
.filter-card .apply-actions > .es-wa-btn{flex:0 0 auto; width:100%}
.btn--outline-light{background:transparent; color:#fff; border-color:rgba(255,255,255,.7)}
.btn--outline-light:hover{background:#fff; color:var(--c-graphite); border-color:#fff}
.btn:active{transform:translateY(1px)}
.btn svg{width:18px; height:18px; flex:none}

.site-header{
  position:sticky; top:0; z-index:60; background:var(--c-white);
  border-bottom:1px solid var(--c-line);
}
.header-inner{display:flex; align-items:center; gap:var(--sp-4); min-height:var(--header-h); position:relative}
.brand{display:flex; align-items:center; gap:var(--sp-3); text-decoration:none; flex:none}
.brand img{width:104px; height:auto; display:block}
.brand-name{font-family:var(--font-display); font-weight:800; font-size:1.2rem; letter-spacing:.01em; text-transform:none; line-height:1.25; color:var(--c-graphite); white-space:nowrap}
.brand-name span{display:block; font-family:var(--font-body); font-weight:500; font-size:.8rem; letter-spacing:0; color:var(--c-muted); margin-top:3px; white-space:normal}
.main-nav{margin-inline:auto}
.main-nav ul{display:flex; gap:var(--sp-1); list-style:none; margin:0; padding:0}
.main-nav a{
  display:flex; align-items:center; min-height:44px; padding:8px 11px; border-radius:var(--radius-sm);
  text-decoration:none; font-weight:500; font-size:.93rem; color:var(--c-graphite); white-space:nowrap;
  transition:background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.main-nav a:hover{background:var(--c-bg-alt)}
.main-nav a[aria-current="page"]{background:var(--c-bg-alt); box-shadow:inset 0 -3px 0 var(--c-accent)}
.header-actions{display:flex; align-items:center; gap:var(--sp-3); flex:none}
.header-tel{display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:6px 10px; text-decoration:none; font-weight:600; font-size:.9rem; border-radius:var(--radius-sm)}
.header-tel:hover{background:var(--c-bg-alt)}
.header-tel svg{width:17px; height:17px; color:var(--c-accent)}
.nav-toggle{display:none; align-items:center; justify-content:center; width:46px; height:46px; border:1px solid var(--c-line); background:#fff; border-radius:var(--radius-sm); cursor:pointer}
.nav-toggle svg{width:22px; height:22px}

.hero{position:relative; isolation:isolate; display:flex; align-items:center; min-height:clamp(540px,86vh,780px); padding-block:var(--sp-8) var(--sp-9); overflow:hidden}
.hero-bg{position:absolute; inset:0; z-index:-2}
.hero-bg img{width:100%; height:100%; object-fit:cover}
.hero-overlay{position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(43,44,46,.87) 0%, rgba(43,44,46,.75) 55%, rgba(43,44,46,.9) 100%)}
.hero-inner{width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:20px}
.hero h1{color:#fff; max-width:22ch; text-transform:none; letter-spacing:.005em}
.hero .lead{color:rgba(255,255,255,.94); font-size:1.125rem; max-width:56ch}
.hero-badges{display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-bottom:var(--sp-4)}
.hero-badge{
  display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:999px;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.35);
  color:#fff; font-size:.8rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
}
.hero-badge svg{width:15px; height:15px; color:#FCD34D}

.filter-card{
  margin-top:var(--sp-6); background:#fff; border-radius:var(--radius-lg);
  box-shadow:0 18px 50px rgba(27,28,30,.35); padding:var(--sp-5); max-width:960px;
}
.filter-tabs{display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-bottom:var(--sp-4); border-bottom:1px solid var(--c-line); padding-bottom:var(--sp-3)}
.filter-tab{
  min-height:44px; padding:8px 16px; border-radius:999px; border:1px solid var(--c-line);
  background:#fff; font-family:var(--font-display); font-weight:600; font-size:.9rem; color:var(--c-primary);
  cursor:pointer; transition:background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.filter-tab:hover{border-color:var(--c-graphite); color:var(--c-graphite)}
.filter-tab[aria-pressed="true"]{background:var(--c-graphite); border-color:var(--c-graphite); color:#fff}
.filter-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:var(--sp-3); align-items:end}
.od-field label{display:block; font-family:var(--font-display); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; color:var(--c-primary); margin-bottom:6px}
.input,.select{
  width:100%; min-height:48px; padding:10px 12px; border:1px solid var(--c-line); border-radius:var(--radius-sm);
  background:var(--c-white); color:var(--c-graphite); font-family:var(--font-body); font-size:1rem;
  transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.input:hover,.select:hover{border-color:var(--c-primary)}
.input:focus,.select:focus{border-color:var(--c-graphite); box-shadow:0 0 0 3px rgba(217,119,6,.28); outline:none}
.input[aria-invalid="true"]{border-color:#B42318}
textarea.input{min-height:120px; resize:vertical; line-height:1.5}
.field-error{display:none; color:#B42318; font-size:.8rem; font-weight:500; padding-top:4px}
.field-error.is-visible{display:block}
.filter-actions{display:flex; gap:var(--sp-3); align-items:center}
.filter-actions .btn{width:100%}

.arch-divider{line-height:0; margin:0; padding:0}
.arch-divider svg{display:block; width:100%; height:clamp(36px,5vw,64px)}

.grid-4{display:grid; gap:var(--sp-4); grid-template-columns:repeat(4,minmax(0,1fr))}
.grid-3{display:grid; gap:var(--sp-5); grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-2{display:grid; gap:var(--sp-5); grid-template-columns:repeat(2,minmax(0,1fr))}

.benefit{
  background:#fff; border:1px solid var(--c-line); border-radius:var(--radius); padding:var(--sp-5);
  box-shadow:var(--shadow-sm); transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.benefit:hover{transform:translateY(-3px); box-shadow:var(--shadow)}
.benefit-icon{
  width:52px; height:52px; border-radius:var(--radius-sm); background:var(--c-bg-alt);
  display:flex; align-items:center; justify-content:center; margin-bottom:var(--sp-4); color:var(--c-graphite);
}
.benefit-icon svg{width:26px; height:26px}
.benefit h3{margin-bottom:var(--sp-2)}
.benefit p{margin:0; color:var(--c-primary); font-size:.95rem}

.card{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--c-line);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow)}
.card-media{position:relative; background:var(--c-bg-alt)}
.card-media img{display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover}
.card-media .badge-float{position:absolute; top:12px; left:12px}
.card-body{display:flex; flex-direction:column; gap:var(--sp-3); padding:var(--sp-5); flex:1 1 auto}
.card-body h3{margin:0}
.card-loc{display:flex; align-items:flex-start; gap:6px; margin:0; color:var(--c-primary); font-size:.9rem}
.card-loc svg{width:16px; height:16px; flex:none; margin-top:3px; color:var(--c-accent)}
.spec-list{display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-4); list-style:none; margin:0; padding:var(--sp-3) 0 0; border-top:1px solid var(--c-line)}
.spec-list li{display:flex; flex-direction:column; font-family:var(--font-display); font-weight:700; font-size:1rem; color:var(--c-graphite); white-space:nowrap}
.spec-list li small{font-family:var(--font-body); font-weight:400; font-size:.72rem; color:var(--c-muted); text-transform:uppercase; letter-spacing:.06em}
.spec-list li .spec-sub{font-family:var(--font-body); font-weight:500; font-size:.78rem; color:var(--c-muted); white-space:nowrap; letter-spacing:0; text-transform:none; margin-top:2px}
.card-actions{margin-top:auto}
.card-actions .btn{width:100%}

.badge{
  display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:999px;
  font-family:var(--font-display); font-weight:700; font-size:.75rem; letter-spacing:.06em; text-transform:uppercase;
  white-space:nowrap;
}
.badge::before{content:""; width:8px; height:8px; border-radius:50%; background:currentColor; flex:none}
.badge--frei{background:var(--c-ok); color:#052e22}
.badge--reserviert{background:var(--c-warn); color:#2e1a02}
.badge--vermietet{background:var(--c-muted); color:#fff}
.badge--provision{background:var(--c-graphite); color:#fff}
.badge--provision::before{background:var(--c-accent)}
.badge--info{background:var(--c-bg-alt); color:var(--c-graphite); border:1px solid var(--c-line)}
.badge--info::before{background:var(--c-accent)}

.empty-state{
  grid-column:1/-1; text-align:center; padding:var(--sp-8) var(--sp-4);
  background:var(--c-bg-alt); border:1px dashed var(--c-line); border-radius:var(--radius);
}
.empty-state h3{margin-bottom:var(--sp-2)}
.empty-state p{color:var(--c-primary); margin-bottom:var(--sp-4)}

.tab-rail{display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-bottom:var(--sp-5)}

.split{display:grid; grid-template-columns:1.05fr .95fr; gap:var(--sp-7); align-items:center}
.split-media img{width:100%; height:auto; display:block; box-shadow:var(--shadow); border-radius:var(--radius-lg) var(--radius-lg) var(--radius) var(--radius)}
.arch-frame{
  border-top-left-radius:180px; border-top-right-radius:180px; border-bottom-left-radius:var(--radius);
  border-bottom-right-radius:var(--radius); overflow:hidden;
}
.arch-frame img{border-radius:0; box-shadow:none}
.checklist{list-style:none; margin:0 0 var(--sp-5); padding:0; display:grid; gap:var(--sp-3)}
.checklist li{display:flex; gap:var(--sp-3); align-items:flex-start; color:var(--c-graphite)}
.checklist svg{width:22px; height:22px; flex:none; color:#B45309; margin-top:2px}
.pull-quote{
  font-family:var(--font-display); font-weight:700; font-size:1.2rem; line-height:1.4;
  border-left:4px solid var(--c-accent); padding-left:var(--sp-4); margin:0 0 var(--sp-5); color:var(--c-graphite);
}

.cta-banner{background:var(--c-graphite); color:#fff; padding-block:var(--sp-8); position:relative; overflow:hidden}
.cta-banner h2{color:#fff; max-width:24ch}
.cta-banner p{color:rgba(255,255,255,.9); font-size:1.05rem; max-width:60ch}
.cta-inner{display:flex; flex-wrap:wrap; gap:var(--sp-5); align-items:center; justify-content:space-between}
.cta-actions{display:flex; flex-wrap:wrap; gap:var(--sp-3)}
.cta-tel{font-family:var(--font-display); font-weight:800; font-size:clamp(1.5rem,3vw,2.25rem); color:#fff; text-decoration:none; white-space:nowrap; display:inline-block; margin-top:8px}
.cta-tel:hover{color:var(--c-accent)}
.cta-arch{position:absolute; inset:auto 0 -2px 0; opacity:.16; line-height:0}
.cta-arch svg{width:100%; height:80px; display:block}

.page-hero{background:var(--c-graphite); color:#fff; padding-block:var(--sp-8); position:relative; overflow:hidden}
.page-hero h1{color:#fff; text-transform:none}
.page-hero .lead{color:rgba(255,255,255,.9)}
.page-hero .eyebrow{color:#F0B357}
.page-hero .hero-arch{position:absolute; right:-70px; top:-50px; width:320px; opacity:.16; pointer-events:none}
.page-hero .hero-arch svg{width:100%; height:auto; display:block}

.contact-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:var(--sp-7)}
.form-card{background:#fff; border:1px solid var(--c-line); border-radius:var(--radius-lg); padding:var(--sp-6); box-shadow:var(--shadow-sm)}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-4)}
.form-summary{
  display:none; margin-bottom:var(--sp-4); padding:var(--sp-3) var(--sp-4); border-radius:var(--radius-sm);
  background:#FEF3F2; border:1px solid #FDA29B; color:#7A271A; font-size:.92rem;
}
.form-summary.is-visible{display:block}
.form-summary ul{margin:6px 0 0; padding-left:18px}
.form-summary a{color:#7A271A}
.form-success{
  display:none; margin-top:var(--sp-4); padding:var(--sp-4); border-radius:var(--radius-sm);
  background:#ECFDF5; border:1px solid #6CE9A6; color:#05603A; font-size:.95rem;
}
.form-success.is-visible{display:block}
.status-notice{
  display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  padding:var(--sp-5); border-radius:var(--radius-sm); border:1px solid #FCD34D;
  background:#FFFBEB; color:#78350F; max-width:860px;
}
.status-notice p{margin:0; font-size:.98rem; line-height:1.6}
.status-notice--vermietet{background:var(--c-bg-alt); border-color:var(--c-line); color:var(--c-graphite)}
.hint{font-size:.85rem; color:var(--c-muted); margin:0}
.hint a{color:var(--c-graphite)}
.contact-panel{background:var(--c-bg-alt); border:1px solid var(--c-line); border-radius:var(--radius-lg); padding:var(--sp-6); display:flex; flex-direction:column; gap:var(--sp-5)}
.contact-item{display:flex; gap:var(--sp-3); align-items:flex-start}
.contact-item svg{width:22px; height:22px; flex:none; color:var(--c-accent); margin-top:3px}
.contact-item strong{display:block; font-family:var(--font-display); font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; color:var(--c-muted); margin-bottom:2px}
.contact-item p,.contact-item a{margin:0; color:var(--c-graphite); text-decoration:none; font-weight:500}
.contact-item a:hover{color:#B45309}
.hours{list-style:none; margin:0; padding:0; display:grid; gap:6px}
.hours li{display:flex; justify-content:space-between; gap:var(--sp-3); font-size:.95rem; border-bottom:1px dashed var(--c-line); padding-bottom:6px}
.hours li span:last-child{font-weight:600; white-space:nowrap}
.map-wrap{position:relative; z-index:0; margin-top:var(--sp-7); border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--c-line); box-shadow:var(--shadow-sm); background:var(--c-bg-alt)}
.map-wrap iframe{display:block; width:100%; height:380px; border:0}
.map-wrap #naim-map{display:block; width:100%; height:380px}

.map-gate{position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-3); padding:var(--sp-5); text-align:center; background:var(--c-bg-alt)}
.map-gate__btn{display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 22px; border-radius:var(--radius-sm); font-family:var(--font-display); font-weight:700; font-size:.95rem; line-height:1.2; cursor:pointer; background:var(--c-graphite); color:#fff; border:2px solid var(--c-graphite); transition:background-color var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease)}
.map-gate__btn:hover{background:var(--c-accent); color:#16171A; border-color:var(--c-accent)}
.map-gate__btn:focus-visible{outline:2px solid var(--c-accent); outline-offset:3px}
.map-gate__note{max-width:38ch; font-family:var(--font-body); font-size:var(--fs-small); line-height:1.5; color:var(--c-muted)}

.modal{position:fixed; inset:0; z-index:100; display:none}
.modal.is-open{display:block}
.modal-scrim{position:absolute; inset:0; background:rgba(27,28,30,.74)}
.modal-panel{
  position:relative; z-index:1; background:#fff; border-radius:var(--radius-lg);
  width:min(940px, calc(100vw - 32px)); max-height:calc(100vh - 48px); overflow-y:auto;
  margin:24px auto; box-shadow:0 30px 80px rgba(0,0,0,.4);
}
.modal-close{
  position:absolute; top:12px; right:12px; z-index:2; width:44px; height:44px; border-radius:0;
  border:1px solid var(--c-line); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.modal-close:hover{background:var(--c-accent); border-color:var(--c-accent); color:#16171A}
.modal-close svg{width:20px; height:20px}
.gallery{background:transparent}
.gallery-stage{position:relative; text-align:center}
.gallery-main{max-height:70vh; width:auto; max-width:100%; height:auto; display:block; margin-inline:auto; border-bottom:1px solid var(--c-line); cursor:zoom-in}
.gallery-zoom-hint{
  position:absolute; left:50%; bottom:14px; transform:translateX(-50%);
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(17,17,17,.62); color:#fff;
  font-family:var(--font-body); font-size:.78rem; font-weight:600;
  letter-spacing:.04em; padding:5px 12px; border-radius:999px;
  pointer-events:none; transition:opacity var(--dur-fast) var(--ease);
}
.gallery-stage:hover .gallery-zoom-hint{opacity:1}
@media (max-width:640px){.gallery-zoom-hint{font-size:.72rem; padding:4px 9px}}
.gallery-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; padding:0; border-radius:0;
  background:rgba(255,255,255,.92); border:1px solid var(--c-line);
  color:var(--c-graphite); display:grid; place-items:center;
  cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.16);
  transition:background var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.gallery-nav:hover{background:#fff}
.gallery-nav:active{transform:translateY(-50%) scale(.94)}
.gallery-nav--prev{left:12px}
.gallery-nav--next{right:12px}
.gallery-counter{
  position:absolute; top:12px; right:12px;
  background:rgba(17,17,17,.62); color:#fff;
  font-family:var(--font-body); font-size:.78rem; font-weight:600;
  letter-spacing:.04em; padding:4px 11px; border-radius:999px;
  font-variant-numeric:tabular-nums; pointer-events:none;
}
.gallery-thumbs{display:flex; gap:8px; padding:10px; overflow-x:auto}
.gallery-thumbs button{border:2px solid transparent; padding:0; background:none; cursor:pointer; border-radius:var(--radius-sm); flex:none; line-height:0}
.gallery-thumbs button[aria-current="true"]{border-color:var(--c-accent)}
.gallery-thumbs img{width:84px; height:60px; object-fit:cover; display:block; border-radius:0}
.lightbox{
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.92);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.lightbox[hidden]{display:none}
.lightbox-figure{margin:0; max-width:100%; max-height:100%; display:flex; flex-direction:column; align-items:center; gap:10px}
.lightbox-figure img{
  max-width:95vw; max-height:92vh; width:auto; height:auto;
  object-fit:contain; display:block;
  box-shadow:0 8px 40px rgba(0,0,0,.5);
}
.lightbox-caption{color:rgba(255,255,255,.85); font-size:.85rem; text-align:center; font-family:var(--font-body)}
.lightbox-close{
  position:absolute; top:16px; right:16px;
  width:44px; height:44px; padding:0;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28);
  border-radius:999px; color:#fff; display:grid; place-items:center;
  cursor:pointer; transition:background var(--dur-fast) var(--ease);
}
.lightbox-close:hover{background:var(--c-accent); border-color:var(--c-accent); color:#16171A}
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:48px; padding:0; border-radius:999px;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28);
  color:#fff; display:grid; place-items:center; cursor:pointer;
  transition:background var(--dur-fast) var(--ease);
}
.lightbox-nav:hover{background:#fff; color:#16171A}
.lightbox-nav--prev{left:16px}
.lightbox-nav--next{right:16px}
@media (max-width:640px){
  .lightbox{padding:12px}
  .lightbox-nav{width:40px; height:40px}
  .lightbox-nav--prev{left:8px}
  .lightbox-nav--next{right:8px}
  .lightbox-close{top:10px; right:10px}
}
.modal-body{padding:var(--sp-6)}
.modal-meta{display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-bottom:var(--sp-3)}
.spec-strip{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:var(--sp-3); margin:var(--sp-4) 0; background:var(--c-bg-alt); border-radius:var(--radius); padding:var(--sp-4)}
.od-stat b{font-family:var(--font-display); font-size:1.3rem; font-weight:800; white-space:nowrap}
.od-stat span{font-size:.75rem; text-transform:uppercase; letter-spacing:.07em; color:var(--c-muted)}
.amenity-list{display:flex; flex-wrap:wrap; gap:var(--sp-2); list-style:none; margin:0 0 var(--sp-5); padding:0}
.amenity-list li{display:inline-flex; align-items:center; gap:6px; background:var(--c-bg-alt); border:1px solid var(--c-line); border-radius:999px; padding:6px 14px; font-size:.85rem; font-weight:500}
.amenity-list svg{width:15px; height:15px; color:#B45309}
.modal-section{border-top:1px solid var(--c-line); padding-top:var(--sp-5); margin-top:var(--sp-5)}
.modal-section h3{margin-bottom:var(--sp-3)}

.site-footer{background:var(--c-graphite); color:rgba(255,255,255,.85); padding-block:var(--sp-8) var(--sp-5); margin-top:auto}
.footer-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:var(--sp-7)}
.footer-brand img{width:120px; height:auto; display:block; margin-bottom:var(--sp-4)}
.footer-brand p{color:rgba(255,255,255,.8); font-size:.95rem; max-width:44ch}
.site-footer h3{color:#fff; font-size:.85rem; text-transform:uppercase; letter-spacing:.14em; margin-bottom:var(--sp-4)}
.footer-links{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.footer-links a{color:rgba(255,255,255,.84); text-decoration:none; display:inline-flex; min-height:32px; align-items:center}
.footer-links a:hover{color:#F0B357}
.footer-contact li{color:rgba(255,255,255,.84)}
.footer-contact a{color:#fff; text-decoration:none}
.footer-contact a:hover{color:#F0B357}
.footer-hours strong{display:block; font-family:var(--font-display); font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.6); font-weight:600; margin-bottom:2px}
.footer-hours span{display:block; min-height:24px; line-height:1.5}
.footer-legal{
  margin-top:var(--sp-7); padding-top:var(--sp-4); border-top:1px solid rgba(255,255,255,.16);
  display:flex; flex-wrap:wrap; gap:var(--sp-3) var(--sp-5); align-items:center; justify-content:space-between;
  font-size:.875rem; color:rgba(255,255,255,.72);
}
.legal-links{display:flex; flex-wrap:wrap; gap:var(--sp-4)}
.legal-links button{
  background:none; border:0; padding:6px 0; min-height:32px; color:rgba(255,255,255,.86);
  font-family:var(--font-body); font-size:.875rem; cursor:pointer; text-decoration:underline; text-underline-offset:3px;
}
.legal-links button:hover{color:#F0B357}
.legal-note{width:100%; margin:var(--sp-2) 0 0; font-size:.85rem; color:rgba(255,255,255,.75); display:none}
.legal-note.is-visible{display:block}

.view[hidden]{display:none}

@media (max-width:1080px){
  .main-nav a{padding:8px 9px; font-size:.9rem}
  .header-tel .tel-text{display:none}
}
@media (max-width:960px){
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split{grid-template-columns:1fr; gap:var(--sp-6)}
  .contact-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr; gap:var(--sp-6)}
  .main-nav{
    position:absolute; top:100%; left:0; right:0; background:#fff; border-bottom:1px solid var(--c-line);
    box-shadow:var(--shadow); padding:var(--sp-3) 20px var(--sp-4); margin:0; display:none;
  }
  .main-nav.is-open{display:block}
  .main-nav ul{flex-direction:column; gap:4px}
  .main-nav a{min-height:48px; font-size:1rem}
  .nav-toggle{display:inline-flex}
  .header-actions .btn{display:none}
}
@media (max-width:768px){
  .section{padding-block:var(--sp-7)}
  .grid-3,.grid-4,.grid-2{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .cta-inner{flex-direction:column; align-items:flex-start}
  .filter-grid{grid-template-columns:1fr}
  .hero{min-height:auto; padding-block:var(--sp-7) var(--sp-8)}
  .modal-panel{width:100%; max-height:100vh; min-height:100vh; margin:0; border-radius:0}
  .map-wrap iframe, .map-wrap #naim-map{height:300px}
}
@media (max-width:400px){
  .brand-name{font-size:.82rem}
  .header-tel{padding:6px 4px}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important}
}

/* ---- Rechtsseiten ---- */
.legal-content{max-width:80ch}
.legal-content h2{font-size:1.35rem; margin-top:var(--sp-6)}
.legal-content h3{font-size:1.1rem; margin-top:var(--sp-5)}
.legal-content p,.legal-content li{color:var(--c-graphite); font-size:1rem; line-height:1.65}
.legal-content ul,.legal-content ol{padding-left:22px; margin:0 0 var(--sp-4); display:grid; gap:8px}
.legal-content a{color:#B45309}
.legal-content table{width:100%; border-collapse:collapse; margin-bottom:var(--sp-4); font-size:.95rem}
.legal-content td,.legal-content th{border:1px solid var(--c-line); padding:8px 10px; text-align:left}

/* Fußzeilen-Links zu den Rechtsseiten */
.legal-links a{
  display:inline-flex; align-items:center; min-height:32px; padding:6px 0;
  color:rgba(255,255,255,.86); font-size:.875rem; text-decoration:underline; text-underline-offset:3px;
}
.legal-links a:hover{color:#F0B357}

/* ---- PC-Dropdown in der Hauptnavigation ---- */
.main-nav li.has-sub{position:relative; display:flex; align-items:center}
.main-nav li.has-sub > a{flex:1 1 auto; padding-right:4px}
.main-nav .sub-toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:44px; padding:0; margin-left:-4px;
  background:none; border:0; border-radius:var(--radius-sm);
  color:var(--c-graphite, #2B2C2E); cursor:pointer;
}
.main-nav .sub-toggle svg{width:15px; height:15px; transition:transform var(--dur-fast, .18s) var(--ease, cubic-bezier(.4,0,.2,1))}
.main-nav li.has-sub.is-open .sub-toggle svg{transform:rotate(180deg)}
.main-nav .sub-menu{
  display:none; position:absolute; top:100%; left:0; z-index:70;
  min-width:236px; margin:6px 0 0; padding:8px; list-style:none;
  background:#fff; border:1px solid var(--c-line, #E5E8EB);
  border-radius:var(--radius, 8px); box-shadow:var(--shadow, 0 10px 30px rgba(43,44,46,.12));
}
.main-nav .sub-menu a{
  display:flex; align-items:center; min-height:44px; padding:8px 12px;
  border-radius:var(--radius-sm, 6px); font-size:.92rem; font-weight:500;
  color:var(--c-ink, #2B2C2E); text-decoration:none; white-space:nowrap;
}
.main-nav .sub-menu a:hover{background:var(--c-bg-alt, #F4F6F8); color:var(--c-accent, #D97706)}
@media (min-width:961px){
  .main-nav li.has-sub:hover .sub-menu,
  .main-nav li.has-sub:focus-within .sub-menu{display:block}
  .main-nav li.has-sub:focus-within .sub-toggle svg{transform:rotate(180deg)}
}
.main-nav li.has-sub.is-open .sub-menu{display:block}
@media (max-width:960px){
  .main-nav li.has-sub{flex-wrap:wrap; width:100%}
  .main-nav .sub-menu{
    position:static; width:100%; min-width:0; margin:0 0 8px;
    box-shadow:none; border:0; background:var(--c-bg-alt, #F4F6F8);
  }
  .main-nav .sub-menu a{min-height:42px; font-size:.95rem}
}
/* ================= Theme-/UX-Ergänzungen (WP-Build) ================= */

/* Karten-Titel als Link (SEO + UX) */
.card h3 a{color:inherit; text-decoration:none}
.card h3 a:hover{color:var(--c-accent)}

/* [hidden] auch bei display:flex/grid */
.grid-3 .card[hidden]{display:none !important}
.grid-3[hidden]{display:none !important}
.empty-state[hidden]{display:none !important}

/* Sticky Header = exakt wie normaler Header (keine Schatten-/Größenänderung) */
.brand img{transition:width .2s ease, height .2s ease}

/* Mobile Menü: Transition statt display:none, Body-Sperre, Hamburger → X */
.nav-toggle-open,.nav-toggle-close{display:inline-flex; align-items:center; justify-content:center}
.nav-toggle-close{display:none}
.nav-toggle[aria-expanded="true"] .nav-toggle-open{display:none}
.nav-toggle[aria-expanded="true"] .nav-toggle-close{display:inline-flex}
body.menu-open{overflow:hidden}
@media (max-width:960px){
  .main-nav{
    display:block; opacity:0; visibility:hidden; pointer-events:none;
    transform:translateY(-8px);
    transition:opacity .2s ease, transform .2s ease, visibility .2s;
    max-height:calc(100vh - 72px); overflow-y:auto;
  }
  .main-nav.is-open{opacity:1; visibility:visible; pointer-events:auto; transform:none}
  .nav-cta{
    display:flex; flex-direction:column; gap:10px;
    margin-top:var(--sp-3); padding-top:var(--sp-3);
    border-top:1px solid var(--c-line);
  }
  .nav-cta .btn{width:100%; justify-content:center; min-height:48px}
}
.nav-cta{display:none}

/* Footer-Touchtargets + 2 Spalten bis 560px */
.footer-links a{min-height:44px}
.legal-links a{min-height:44px}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr}
}

/* Back-to-top */
.back-to-top{
  position:fixed; right:20px; bottom:24px; z-index:80;
  width:46px; height:46px; border-radius:0;
  border:1px solid var(--c-line); background:#fff; color:var(--c-graphite);
  box-shadow:var(--shadow); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
}
.back-to-top svg{width:20px; height:20px}
.back-to-top:hover{color:var(--c-accent)}
.back-to-top.is-visible{opacity:1; visibility:visible; transform:none}

/* Page-Hero: Icon im Lead */
.page-hero .lead svg{width:16px; height:16px; vertical-align:-3px}

/* Fließtext auf Standardseiten */
.naim-content{max-width:80ch}
.naim-content h2{font-size:1.35rem; margin-top:var(--sp-6)}
.naim-content h3{font-size:1.1rem; margin-top:var(--sp-5)}
.naim-content p,.naim-content li{color:var(--c-graphite); line-height:1.65}
.naim-content ul,.naim-content ol{padding-left:22px; margin:0 0 var(--sp-4); display:grid; gap:8px}
.naim-content a{color:#B45309}
.naim-content img{max-width:100%; height:auto; border-radius:var(--radius)}

/* Filter-Zustand auf Übersichtsseiten: Tab-Rail sichtbar, Rail-Wrapper optisch wie Statik */
.tab-rail .filter-tab[aria-pressed="true"]{background:var(--c-graphite); color:#fff; border-color:var(--c-graphite)}

/* ================= Topbar, Header-Feinschliff, Footer-Menü ================= */
.topbar{background:var(--c-graphite, #2B2C2E); color:#fff; font-size:.82rem; position:relative; z-index:61}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between; gap:8px 24px;
  min-height:40px; padding-block:6px;
}
.topbar-group{display:flex; flex-wrap:wrap; align-items:center; gap:6px 22px}
.topbar-item{
  display:inline-flex; align-items:center; gap:7px; min-height:28px;
  color:rgba(255,255,255,.88); text-decoration:none; letter-spacing:.01em;
  transition:color var(--dur-fast) var(--ease);
}
.topbar-item:hover{color:#F0B357}
.topbar-item svg{width:14px; height:14px; flex:none; color:var(--c-accent, #D97706)}

/* Header: Logo & Menü kompakter, kein Umbruch */
.header-inner{gap:var(--sp-3)}
.brand-name{font-size:.9rem}
.brand img{transition:width .2s ease, height .2s ease}

/* Rechtsseiten-Menü im Footer: keine Aufzählungspunkte */
.legal-links ul,
.legal-links ul.legal-menu{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; gap:var(--sp-4);
}
.legal-links ul li{display:flex; align-items:center}

/* Kleine Screens: Topbar reduzieren */
@media (max-width:640px){
  .topbar-item--addr{display:none}
  .topbar-inner{justify-content:center}
  .topbar-group{justify-content:center; gap:6px 16px}
  .brand-name span{font-size:.7rem; line-height:1.35; margin-top:3px}
  .brand img{width:74px}
}

/* ================= Mobile-Header Überarbeitung ================= */
@media (max-width:960px){
  /* Panel randlos unter dem Header (Anker = .site-header) */
  .header-inner{position:static}
  .main-nav{
    top:100%; left:0; right:0;
    max-height:calc(100dvh - var(--header-h));
    padding:10px 16px 28px;
    border-top:1px solid var(--c-line);
  }
  .main-nav ul{gap:2px}
  .main-nav li{
    border-radius:var(--radius-sm); background:var(--c-bg-alt, #F4F6F8);
  }
  .main-nav li a{
    min-height:50px; font-size:1rem; font-weight:600; padding:10px 14px;
  }
  .main-nav li.has-sub > a{padding-right:4px}
  .main-nav .sub-toggle{width:48px; height:50px; margin-left:auto; margin-right:8px}
  .main-nav .sub-menu{
    margin:0 8px 8px; padding:4px; border-radius:var(--radius-sm);
    box-shadow:none; border:1px solid var(--c-line);
  }
  .main-nav .sub-menu a{min-height:46px; padding:8px 12px 8px 18px; font-weight:500}
  .main-nav .sub-menu li + li{margin-top:2px}
  .nav-cta{
    margin-top:12px; padding-top:14px;
  }
  .nav-cta .btn{min-height:52px; font-size:1rem}

  /* Overlay-Dimming beim offenen Menü */
  body.menu-open::after{
    content:""; position:fixed; inset:0; z-index:55;
    background:rgba(23,24,26,.5);
  }

  /* Header kompakter auf Mobil */
  .header-inner{min-height:104px}
  .nav-toggle{width:48px; height:48px}
  .nav-toggle svg{width:24px; height:24px}
}

@media (max-width:640px){
  .topbar-inner{min-height:34px; padding-block:4px}
  .topbar{font-size:.78rem}
  .brand img{width:76px}
  .brand-name{font-size:1.05rem}
}
@media (max-width:400px){
  .topbar-item{gap:5px}
  .topbar-group{gap:4px 12px}
  .brand img{width:68px}
  .brand-name{font-size:.92rem}
  .brand-name span{font-size:.64rem}
}

/* ================= Mobile Header – UI/UX ================= */
@media (max-width:960px){
  /* Brand darf schrumpfen: Tagline wird mit Ellipsis abgeschnitten */
  .brand{flex:1 1 auto; min-width:0}
  .brand-name{min-width:0; overflow:hidden}
  .brand-name span{white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-height:2.7em}

  /* Hamburger als sauberer Touch-Button */
  .header-actions{margin-left:auto; flex:none}
  .nav-toggle{
    width:50px; height:50px; border-radius:0;
    background:var(--c-bg-alt); border:1px solid var(--c-line);
    color:var(--c-graphite); flex:none;
    transition:background .15s ease, border-color .15s ease, color .15s ease, transform .1s ease;
  }
  .nav-toggle:hover{background:#fff; border-color:#d5dbe2}
  .nav-toggle:active{transform:scale(.94)}
  .nav-toggle[aria-expanded="true"]{
    background:var(--c-graphite); border-color:var(--c-graphite); color:#fff;
  }

  /* Menü-Panel wirft weichen Schatten nach unten */
  .main-nav{box-shadow:0 26px 50px -28px rgba(23,24,26,.45)}
}

/* ================= Desktop-Dropdown: Hover-Einheit + kein Abgrund ================= */
@media (min-width:961px){
  /* Text und Chevron verschmelzen zu EINEM Pill bei Hover/Fokus */
  .main-nav li.has-sub > a{padding-right:2px}
  .main-nav .sub-toggle{margin-left:-6px; border-radius:var(--radius-sm)}
  .main-nav li.has-sub:hover > a,
  .main-nav li.has-sub:focus-within > a,
  .main-nav li.has-sub:hover .sub-toggle,
  .main-nav li.has-sub:focus-within .sub-toggle,
  .main-nav li.has-sub.is-open > a,
  .main-nav li.has-sub.is-open .sub-toggle{
    background:var(--c-bg-alt);
  }

  /* Panel direkt am Item – kein 6px-Hover-Abgrund beim Weg zur Unterliste */
  .main-nav .sub-menu{margin-top:0}
  .main-nav .sub-menu::before{
    content:""; position:absolute; left:0; right:0; top:-12px; height:12px;
  }
}

/* ================= Stellenangebote (Karriere) ================= */
.honeypot{display:none !important}
.empty-state h2{margin-bottom:var(--sp-2)}

.job-filters{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:var(--sp-4);
  align-items:end; margin-bottom:var(--sp-5); padding:var(--sp-4) var(--sp-5);
  background:var(--c-bg-alt); border:1px solid var(--c-line); border-radius:var(--radius-lg);
}
.job-filters .od-field label{margin-bottom:6px}
.job-count{margin:0; font-size:.9rem; font-weight:600; color:var(--c-muted); padding-bottom:14px}

.job-grid{align-items:stretch}
.job-card{
  display:flex; flex-direction:column; gap:var(--sp-2);
  background:#fff; border:1px solid var(--c-line); border-radius:var(--radius-lg);
  padding:var(--sp-5); text-decoration:none; color:var(--c-graphite);
  transition:border-color .18s var(--ease,cubic-bezier(.4,0,.2,1)), box-shadow .18s var(--ease,cubic-bezier(.4,0,.2,1)), transform .18s var(--ease,cubic-bezier(.4,0,.2,1));
}
.job-card:hover{border-color:var(--c-graphite); box-shadow:var(--shadow); transform:translateY(-2px)}
.job-card[hidden]{display:none !important}
.job-card-badges{display:flex; flex-wrap:wrap; gap:6px}
.job-card-title{font-size:1.12rem; line-height:1.3; margin:0}
.job-card-text{color:var(--c-primary); font-size:.92rem; line-height:1.55; margin:0; flex:1}
.job-card-more{
  display:inline-flex; align-items:center; gap:6px;
  font-weight:600; font-size:.9rem; color:#B45309;
}
.job-card-arrow{width:15px; height:15px; transform:rotate(90deg)}
.job-card--init{background:var(--c-graphite); border-color:var(--c-graphite); color:#fff}
.job-card--init:hover{border-color:var(--c-accent); box-shadow:0 18px 40px -20px rgba(23,24,26,.6)}
.job-card--init .job-card-title{color:#fff}
.job-card--init .job-card-text{color:rgba(255,255,255,.82)}
.job-card--init .job-card-more{color:#FCD34D}
.job-card--init .badge--provision{background:var(--c-accent); color:#16171A}
.job-card--init .badge--provision::before{background:#16171A}

.job-empty{
  margin-top:var(--sp-4); padding:var(--sp-5); text-align:center;
  background:var(--c-bg-alt); border:1px dashed var(--c-line);
  border-radius:var(--radius-lg); color:var(--c-muted);
}
.job-empty[hidden]{display:none !important}

.job-hero-badges{margin-top:var(--sp-3); margin-bottom:0}
.job-hero-badges .badge--info{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.35); color:#fff}
.job-hero-badges .badge--info::before{background:#F0B357}

.job-meta-line{
  display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-5);
  margin-top:var(--sp-5); padding:var(--sp-4) var(--sp-5);
  background:var(--c-bg-alt); border:1px solid var(--c-line);
  border-radius:var(--radius); font-size:.95rem;
}
.job-meta-line strong{font-family:var(--font-display)}

/* Bewerbungsformular */
.apply-wrap{margin-top:var(--sp-7); scroll-margin-top:176px}
.apply-card{max-width:860px}
.apply-title{font-size:1.4rem; margin-bottom:var(--sp-4)}
.apply-form .form-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-4)}
.od-field--full{grid-column:1 / -1}
.input--file{padding:9px 10px; background:var(--c-bg-alt); font-size:.92rem}
.input--file::file-selector-button{
  margin-right:10px; padding:7px 14px; border:1px solid var(--c-line);
  border-radius:var(--radius-sm); background:#fff; color:var(--c-graphite);
  font-weight:600; font-size:.85rem; cursor:pointer;
}
.input--file::file-selector-button:hover{border-color:var(--c-graphite)}
.apply-consent-label{
  display:flex; gap:10px; align-items:flex-start;
  font-family:var(--font-body); font-weight:400; font-size:.86rem;
  letter-spacing:0; text-transform:none; color:var(--c-primary);
  line-height:1.55; cursor:pointer; margin:0;
}
.apply-consent-label input{margin-top:3px; width:16px; height:16px; flex:none; accent-color:var(--c-graphite)}
.apply-consent-label a{color:var(--c-graphite); text-decoration:underline; text-underline-offset:2px}
.apply-actions{display:flex; align-items:center; gap:var(--sp-4); margin-top:var(--sp-5); flex-wrap:wrap}

@media (max-width:768px){
  .apply-form .form-grid{grid-template-columns:1fr}
  .job-card{padding:var(--sp-4)}
}

/* ================= Logo & Header-Text: feste Größen auf allen Devices ================= */
/* Sticky (is-compact) = identische Größe wie normal, kein Springen beim Scrollen */
.brand img{width:104px; height:auto}
.brand-name{font-size:.9rem}
.brand-name span{font-size:.8rem}

@media (max-width:960px){
  .brand img{width:96px; height:auto}
  .brand-name{font-size:.9rem}
  .brand-name span{font-size:.76rem}
}
@media (max-width:640px){
  .brand img{width:76px; height:auto}
  .brand-name{font-size:1.05rem}
  .brand-name span{font-size:.7rem}
}
@media (max-width:400px){
  .brand img{width:68px; height:auto}
  .brand-name{font-size:.92rem}
  .brand-name span{font-size:.64rem}
}