/* Startseite V2: Shop-Button im Video, Leistungen unten im Video, persönlicher Hinweis */
.video-hero-actions { margin-top: 30px; display: flex; justify-content: center; }
.hero.video-hero { padding-bottom: 120px; }
.hero-services { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: flex; justify-content: center; border-top: 1px solid rgba(255,255,255,.22); background: rgba(12,12,14,.28); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.hero-services a { flex: 1 1 0; max-width: 260px; padding: 18px 12px 64px; color: #fff; text-align: center; font: 700 .9rem/1.3 'DM Sans', sans-serif; text-decoration: none; border-left: 1px solid rgba(255,255,255,.18); transition: background .2s ease; }
.hero-services a:first-child { border-left: 0; }
.hero-services a:hover { background: rgba(255,255,255,.12); }
main > .custom-call { order: 1; width: min(1080px, calc(100% - 40px)); margin: -46px auto 56px; }
@media (max-width: 760px) {
  .hero.video-hero { min-height: 0 !important; padding-top: 64px; padding-bottom: 80px; }
  .hero-services { display: none; }
  main > .custom-call { width: calc(100% - 32px); margin: -32px auto 36px; }
}

/* Shop-Hinweis beim Scrollen im Stil der Bernd-Bode-Karte, mit Teamfotos */
.team-pop.shop-pop-card { border-top: 0; padding: 30px 30px 26px; box-shadow: 0 30px 80px rgba(0,0,0,.28); }
.team-pop-faces { display: flex; justify-content: center; margin: 4px 0 10px; }
.team-pop-faces img { width: 62px; height: 62px; border-radius: 50%; object-fit: cover; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(32,35,40,.15); margin-left: -14px; }
.team-pop-faces img:first-child { margin-left: 0; }
.team-pop .shop-pop-title { font-size: 1.75rem; }
.team-pop .shop-pop-go { min-height: 58px; background: #d8292f; font-size: 1.08rem; box-shadow: 0 10px 22px rgba(216,41,47,.35); transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.team-pop .shop-pop-go:hover { background: #b81f25; transform: translateY(-2px); box-shadow: 0 14px 28px rgba(216,41,47,.4); }
@media (max-width: 420px) { .team-pop-faces img { width: 54px; height: 54px; margin-left: -12px; } }

/* SEO-Bereich „Mehr über bmerch erfahren“: kleiner und ruhiger */
.seo-note { padding-top: 20px; font-size: .9rem; }
.seo-note > details > summary { padding: 8px 14px; font-size: .82rem; font-weight: 600; color: #68707b; background: transparent; border: 1px solid #e3e4e2; }
.seo-accordions { max-width: 760px; margin-top: 8px; }
.seo-accordions summary { padding: 9px 2px; font-size: .84rem; font-weight: 600; color: #4b525b; }
.seo-accordions summary::after { font-size: 1rem; line-height: 1; }
.seo-accordions details > div { font-size: .86rem; line-height: 1.55; padding-bottom: 14px; }
.seo-accordions details > div p { margin: 0 0 10px; }
.seo-note h2, .seo-note h3 { font-size: 1.05rem !important; line-height: 1.3 !important; }
@media (max-width: 700px) {
  .seo-accordion-columns { gap: 0; }
  .seo-accordions summary { padding: 8px 2px; font-size: .8rem; }
}
/* alle Unterpunkte im SEO-Bereich gleich klein (auch Budgetplanung, Anlässe, Gegenangebote) */
.seo-note .seo-accordions summary, .seo-note .seo-compact-pair summary, .seo-note details details > summary { padding: 9px 2px !important; font-size: .84rem !important; font-weight: 600 !important; color: #4b525b !important; line-height: 1.35 !important; min-height: 0 !important; }
.seo-note .seo-accordions summary::after, .seo-note .seo-compact-pair summary::after { font-size: 1rem !important; line-height: 1 !important; font-weight: 400 !important; }
.seo-note .seo-compact-pair > details > summary { border-top-width: 1px !important; border-bottom-width: 1px !important; }
@media (max-width: 700px) { .seo-note .seo-accordions summary, .seo-note .seo-compact-pair summary { padding: 8px 2px !important; font-size: .8rem !important; } }
.services-intro-more { margin-top: 10px; color: #68707b; font-size: .98rem; }

/* Wechselnde Leistung im Startvideo */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hero.video-hero h1.hero-rotate { display: block; white-space: nowrap; overflow: hidden; padding: .06em 0 .1em; margin-left: -50vw; margin-right: -50vw; text-align: center; }
.hero-rotate-word { display: inline-block; will-change: transform, opacity, filter; }
.hero-rotate-word.out { animation: rot-out .45s cubic-bezier(.6,0,.8,.4) forwards; }
.hero-rotate-word.in { animation: rot-in .6s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes rot-out { to { transform: translateY(-55%); opacity: 0; filter: blur(6px); } }
@keyframes rot-in { from { transform: translateY(55%); opacity: 0; filter: blur(6px); } to { transform: none; opacity: 1; filter: none; } }
@media (prefers-reduced-motion: reduce) { .hero-rotate-word.out, .hero-rotate-word.in { animation: none; } }

/* Shop-Banner: Seite dahinter nicht mehr abdunkeln */
.shop-pop, .shop-pop.show { background: transparent !important; pointer-events: none !important; }
.shop-pop.show .shop-pop-card { pointer-events: auto; }
.team-pop.shop-pop-card { box-shadow: 0 24px 70px rgba(32,35,40,.28), 0 0 0 1px rgba(32,35,40,.06); }
@media (max-width: 700px) { .hero.video-hero h1.hero-rotate { letter-spacing: .03em; } }

/* Banner: kleine Zeile ganz oben, Nummer dezent verlinkt */
.team-pop-who { margin: 16px 0 14px; padding: 0; font-size: .74rem; letter-spacing: .01em; color: #68707b; }
.team-pop-tel { display: flex; width: max-content; align-items: center; gap: 5px; margin: 4px auto 0; color: #68707b; text-decoration: none; white-space: nowrap; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .35s ease, color .2s ease; padding-bottom: 1px; }
.team-pop-tel svg { width: 11px; height: 11px; fill: #d8292f; transform-origin: 50% 50%; animation: tel-klingeln 4.5s ease-in-out infinite; }
.team-pop-tel:hover, .team-pop-tel:focus-visible { color: #202328; background-size: 100% 1px; }
@keyframes tel-klingeln { 0%, 78%, 100% { transform: rotate(0); } 82% { transform: rotate(-16deg); } 86% { transform: rotate(14deg); } 90% { transform: rotate(-10deg); } 94% { transform: rotate(6deg); } }
@media (prefers-reduced-motion: reduce) { .team-pop-tel svg { animation: none; } }


/* PC: Video etwas niedriger, damit die Karte von Bernd Bode beim Öffnen sichtbar ist */
@media (min-width: 701px) { .hero.video-hero { min-height: max(430px, calc(100vh - 262px)); min-height: max(430px, calc(100svh - 262px)); } }

/* PC: Schnellkontakt erst nach dem Bereich „Erfahrung, die man zählen kann“ zeigen. Handy: immer sichtbar */
@media (min-width: 701px) {
  .quickbar { transition: opacity .35s ease, transform .35s ease; }
  html:not(.qb-frei) .quickbar { opacity: 0; pointer-events: none; transform: translateY(16px); }
}

/* Immer heller Hintergrund, auch wenn der PC auf dunkel steht */
html { background: #fff; color-scheme: light; } body { background: #fff; }
/* Anfrageformular kurz hervorheben, wenn man über „Anfrage in 60 Sekunden“ kommt */
.contact-form.form-blitz { animation: form-blitz 1.6s ease; border-radius: 4px; }
@keyframes form-blitz { 0%, 100% { box-shadow: 0 0 0 0 rgba(216,41,47,0); } 25% { box-shadow: 0 0 0 10px rgba(216,41,47,.35); } }
.qb-call.zeigt-nummer { background: #202328 !important; color: #fff !important; }

/* Leiste unten ab dem Ende der Seite ausblenden */
.quickbar { transition: opacity .35s ease, transform .35s ease; }
html.qb-ende .quickbar { opacity: 0 !important; pointer-events: none !important; transform: translateY(16px) !important; }

/* Zahlen hell statt dunkel, damit der Übergang von den Leistungen weich bleibt */
.facts { background: #f5f5f3; color: #202328; }
.facts-head .eyebrow { color: #d8292f; }
.facts .cnt-num { color: #202328; }
.facts .cnt-label { color: #5d646e; }
.facts .cnt-sub { color: #858a92; }
.facts .cnt + .cnt::before { background: rgba(32,35,40,.14); }
@media (max-width: 900px) { .facts .cnt:nth-child(3n+1)::before { display: none; } }

/* Branchen unter den Zahlen */
.branchen-zahlen { margin-top: clamp(40px, 6vw, 70px); background: transparent !important; border-top: 1px solid rgba(32,35,40,.12) !important; border-bottom: 0 !important; }
.branchen-zahlen .branchen-row { padding: 22px 0 0; }
.branchen-zahlen .branchen-track span { font: 400 clamp(1.15rem, 1.6vw, 1.45rem)/1.2 'DM Serif Display', Georgia, serif; color: #202328; }
.branchen-zahlen .branchen-track span::after { color: #b9bcc0; }

/* Branche beim Darüberfahren hervorheben */
.branchen-track:hover { animation-play-state: paused; }
.branchen-track span { display: inline-block; transition: transform .3s cubic-bezier(.2,1.4,.4,1), color .2s ease; transform-origin: center bottom; cursor: default; }
.branchen-track span:hover { transform: scale(1.18) translateY(-2px); color: #d8292f; }

/* Teamfotos zum Antippen, groß und in Farbe */
.team .team-grid article img { cursor: zoom-in; }
@media (min-width: 701px) { .person { width: min(460px, calc(100% - 40px)); } .person img { aspect-ratio: 4 / 5; } }
/* Branchen unter den Zahlen laufen erst los, wenn man dort ist, damit Banken und Versicherungen zuerst zu sehen sind */
.branchen-zahlen .branchen-track { animation-play-state: paused; }
.branchen-zahlen.laeuft .branchen-track { animation-play-state: running; }
.branchen-zahlen.laeuft .branchen-track:hover { animation-play-state: paused; }
.branchen-zahlen .branchen-track { padding-left: 5vw; }

/* Zahlen: weißer Hintergrund, Zahlen groß in Rot, damit sie wirken */
.facts { background: #fff; border-top: 1px solid #e3e4e2; }
.facts .cnt-num { color: #d8292f; font-size: clamp(2.6rem, 4.8vw, 4.1rem); }
.facts .cnt-num i { color: #202328; }
.facts .cnt-label { color: #202328; }
.facts .cnt-sub { color: #68707b; }
.branchen-zahlen { border-top-color: #e3e4e2 !important; }

/* ===== Zahlen mit Siebdruck-Video im Hintergrund ===== */
.facts { position: relative; isolation: isolate; background: #16181c !important; border-top: 0 !important; padding-top: clamp(64px, 7vw, 88px) !important; padding-bottom: clamp(40px, 5vw, 56px) !important; }
.facts-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.facts::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(18,20,24,.84), rgba(18,20,24,.78) 55%, rgba(18,20,24,.88)); }
.facts-head .eyebrow { color: #ff8a8e !important; }
.facts-head h2 { color: #fff; }
.facts .cnt-num { color: #fff !important; }
.facts .cnt-num i { color: #d8292f !important; }
.facts .cnt-label { color: #fff !important; }
.facts .cnt-sub { color: #c4c8cd !important; }
.facts .cnt + .cnt::before { background: rgba(255,255,255,.2) !important; }
.branchen-zahlen { margin-top: clamp(32px, 4vw, 48px) !important; border-top: 1px solid rgba(255,255,255,.16) !important; }
.branchen-zahlen .branchen-row { padding: 18px 0 0 !important; }
.branchen-zahlen .branchen-track span { color: #fff !important; }
.branchen-zahlen .branchen-track span::after { color: rgba(255,255,255,.45) !important; }

/* Zahlen: schlichte Bewegung beim Darüberfahren oder Antippen */
.facts .cnt { cursor: default; }
.facts .cnt-num { display: inline-block; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.facts .cnt::after { content: ""; position: absolute; left: 50%; bottom: -8px; width: 0; height: 2px; background: #d8292f; transform: translateX(-50%); transition: width .45s cubic-bezier(.2,.8,.2,1); }
.facts .cnt:hover .cnt-num, .facts .cnt.tipp .cnt-num { transform: translateY(-5px) scale(1.06); }
.facts .cnt:hover::after, .facts .cnt.tipp::after { width: 42px; }

/* Branchen: beim Darüberfahren langsamer statt stehen bleiben, Branche dezent hervorheben */
.branchen-zahlen.laeuft .branchen-track:hover { animation-play-state: running !important; }
.branchen-track span { transition: transform .45s cubic-bezier(.2,.8,.2,1), color .3s ease !important; }
.branchen-track span:hover { transform: translateY(-3px) scale(1.08) !important; color: #e42026 !important; }

/* Abstände etwas enger */
.team.section { padding-top: clamp(56px, 6vw, 76px) !important; }
.shop-banner { margin-top: clamp(40px, 5vw, 64px) !important; }

/* Fünf Teamfotos nebeneinander */
.people-gallery > div { grid-template-columns: repeat(5, 1fr) !important; }
@media (max-width: 600px) { .people-gallery > div { grid-template-columns: repeat(3, 1fr) !important; } }
.team.section { padding-bottom: clamp(48px, 5vw, 64px) !important; }


/* Teamfenster: Text immer vollständig sichtbar */
.person { max-height: calc(100vh - 40px); overflow-y: auto; }
.person img { max-height: 46vh; }
@media (min-width: 701px) { .person img { aspect-ratio: 1 / 1; } }

/* ===== Leistungen am PC als Register (Idee 1) ===== */
@media (min-width: 901px) {
  .services.section { background: #fff !important; }
  .services .service-grid { display: block !important; border: 0 !important; border-top: 1px solid #e3e4e2 !important; background: none !important; gap: 0 !important; }
  .services .service-card, .services .service-card.featured { position: relative; display: grid !important; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto; align-items: center; gap: 28px; min-height: 0 !important; padding: 26px 18px !important; background: transparent !important; color: #202328 !important; border: 0 !important; border-bottom: 1px solid #e3e4e2 !important; box-shadow: none !important; overflow: hidden; isolation: isolate; transform: none !important; transition: color .35s ease; }
  .services .service-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #d8292f; transform: scaleY(0); transform-origin: bottom; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
  .services .service-card::after { display: none !important; }
  .services .service-card h3 { margin: 0 !important; font: 400 clamp(1.7rem, 3.2vw, 2.7rem)/1.05 'DM Serif Display', Georgia, serif !important; letter-spacing: -.02em; color: inherit !important; transition: transform .45s cubic-bezier(.2,.8,.2,1), color .35s ease; }
  .services .service-card p { margin: 0 !important; font-size: .95rem !important; line-height: 1.55; color: #5d646e !important; opacity: 0; transform: translateY(8px); transition: opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1), color .35s ease; }
  .services .service-card .service-actions { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 18px !important; margin: 0 !important; padding: 0 !important; opacity: 0; transform: translateX(10px); transition: opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1); }
  .services .service-card .service-more { color: inherit !important; border-color: currentColor !important; white-space: nowrap; }
  .services .service-card .service-request { background: #d8292f !important; color: #fff !important; border: 0 !important; white-space: nowrap; }
  .services .service-grid:hover .service-card:not(:hover) h3 { color: #b9bcc0 !important; }
  .services .service-card:hover, .services .service-card:focus-within { color: #fff !important; }
  .services .service-card:hover::before, .services .service-card:focus-within::before { transform: scaleY(1); }
  .services .service-card:hover h3, .services .service-card:focus-within h3 { transform: translateX(10px); }
  .services .service-card:hover p, .services .service-card:focus-within p { opacity: 1; transform: none; color: #fff !important; }
  .services .service-card:hover .service-actions, .services .service-card:focus-within .service-actions { opacity: 1; transform: none; }
  .services .service-card:hover .service-request, .services .service-card:focus-within .service-request { background: #fff !important; color: #d8292f !important; }
}

/* Register: öffnet sich erst beim Anklicken, Plus lädt dezent zum Klicken ein */
@media (min-width: 901px) {
  .services .service-card { cursor: pointer; padding-right: 96px !important; }
  .services .service-card.offen { padding-right: 18px !important; }
  /* Darüberfahren öffnet nicht mehr */
  .services .service-grid:hover .service-card:not(:hover) h3 { color: inherit !important; }
  .services .service-card:hover:not(.offen), .services .service-card:focus-within:not(.offen) { color: #202328 !important; }
  .services .service-card:hover:not(.offen)::before, .services .service-card:focus-within:not(.offen)::before { transform: scaleY(0) !important; }
  .services .service-card:hover:not(.offen) p, .services .service-card:focus-within:not(.offen) p { opacity: 0 !important; transform: translateY(8px) !important; }
  .services .service-card:hover:not(.offen) .service-actions, .services .service-card:focus-within:not(.offen) .service-actions { opacity: 0 !important; transform: translateX(10px) !important; pointer-events: none; }
  .services .service-card:not(.offen) .service-actions { pointer-events: none; }
  .services .service-card:hover:not(.offen) h3 { transform: translateX(8px) !important; color: #d8292f !important; }
  /* Plus rechts */
  .services .service-card::after { display: block !important; content: "" !important; position: absolute; right: 22px; top: 50%; width: 48px; height: 48px; margin-top: -24px; border: 1.5px solid #d6d8db; border-radius: 50%; transform: none !important; left: auto !important; bottom: auto !important;
    background: linear-gradient(#202328, #202328) center / 16px 2px no-repeat, linear-gradient(#202328, #202328) center / 2px 16px no-repeat !important;
    transition: border-color .3s ease, background-color .3s ease, opacity .3s ease, transform .4s cubic-bezier(.2,.8,.2,1) !important; animation: plus-winkt 3.2s ease-in-out infinite; }
  .services .service-card:nth-child(2)::after { animation-delay: .25s; } .services .service-card:nth-child(3)::after { animation-delay: .5s; }
  .services .service-card:nth-child(4)::after { animation-delay: .75s; } .services .service-card:nth-child(5)::after { animation-delay: 1s; }
  .services .service-card:hover:not(.offen)::after { border-color: #d8292f; background-color: #d8292f !important; background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff) !important; transform: rotate(90deg) !important; animation: none; }
  .services .service-card.offen::after { opacity: 0; animation: none; }
  /* Geöffnete Zeile */
  .services .service-card.offen { color: #fff !important; }
  .services .service-card.offen::before { transform: scaleY(1) !important; }
  .services .service-card.offen h3 { transform: translateX(10px) !important; color: #fff !important; }
  .services .service-card.offen p { opacity: 1 !important; transform: none !important; color: #fff !important; }
  .services .service-card.offen .service-actions { opacity: 1 !important; transform: none !important; pointer-events: auto; }
  .services .service-card.offen .service-request { background: #fff !important; color: #d8292f !important; }
  .services .service-grid.hat-offen .service-card:not(.offen) h3 { color: #b9bcc0 !important; }
  .services .service-grid.hat-offen .service-card:not(.offen):hover h3 { color: #d8292f !important; }
}
@keyframes plus-winkt { 0%, 70%, 100% { box-shadow: 0 0 0 0 rgba(216,41,47,0); } 80% { box-shadow: 0 0 0 7px rgba(216,41,47,.14); } 92% { box-shadow: 0 0 0 12px rgba(216,41,47,0); } }
@media (prefers-reduced-motion: reduce) { .services .service-card::after { animation: none !important; } }
@media (min-width: 901px) { .services .service-card::after { transform-origin: 50% 50% !important; } }

/* Register kompakter: geschlossene Zeilen nehmen nur die Höhe des Namens ein */
@media (min-width: 901px) {
  .services .service-card, .services .service-card.featured { padding-top: 15px !important; padding-bottom: 15px !important; gap: 24px !important; }
  .services .service-card h3 { font-size: clamp(1.45rem, 2.3vw, 1.95rem) !important; }
  .services .service-card:not(.offen) p, .services .service-card:not(.offen) .service-actions { position: absolute !important; visibility: hidden; }
  .services .service-card.offen { padding-top: 22px !important; padding-bottom: 22px !important; }
  .services .service-card::after { width: 40px !important; height: 40px !important; margin-top: -20px !important; right: 20px !important; }
  .services .section-heading { margin-bottom: 22px !important; }
}

/* Leistungen: weiches Aufklappen und kurzes Zitat aus dem Team */
.services .service-zitat { display: none; }
@media (min-width: 901px) {
  .services .service-card, .services .service-card.featured { grid-template-areas: "h p a" "z p a"; row-gap: 0 !important; }
  .services .service-card h3 { grid-area: h; }
  .services .service-card p { grid-area: p; }
  .services .service-card .service-actions { grid-area: a; }
  .services .service-zitat { display: flex; grid-area: z; align-items: center; gap: 14px; margin: 14px 0 0 10px; opacity: 0; transform: translateY(10px); transition: opacity .2s ease, transform .5s cubic-bezier(.2,.8,.2,1); }
  .services .service-card:not(.offen):not(.klappt) .service-zitat { position: absolute; visibility: hidden; }
  .services .service-card.klappt p, .services .service-card.klappt .service-actions, .services .service-card.klappt .service-zitat { position: static !important; visibility: visible !important; opacity: 0 !important; transition: opacity .18s ease !important; }
  .services .service-card.offen p { transition: opacity .45s ease .14s, transform .55s cubic-bezier(.2,.8,.2,1) .14s, color .35s ease !important; }
  .services .service-card.offen .service-actions { transition: opacity .45s ease .22s, transform .55s cubic-bezier(.2,.8,.2,1) .22s !important; }
  .services .service-card.offen .service-zitat { opacity: 1; transform: none; transition: opacity .45s ease .28s, transform .6s cubic-bezier(.2,.8,.2,1) .28s; }
  .services .service-card::before { transition: transform .56s cubic-bezier(.22,.8,.24,1) !important; }
  .services .service-zitat img { width: 52px; height: 52px; flex: none; border-radius: 50%; object-fit: cover; border: 2px solid #fff; box-shadow: 0 6px 16px rgba(0,0,0,.18); }
  .services .service-zitat blockquote { margin: 0; color: #fff; font: italic 400 1.05rem/1.35 'DM Serif Display', Georgia, serif; max-width: 380px; }
  .services .service-zitat cite { display: block; margin-top: 4px; font: normal 700 .7rem/1.2 'DM Sans', sans-serif; letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
}
@media (max-width: 700px) {
  .services .service-zitat { display: flex; align-items: center; gap: 12px; margin: 0; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .45s ease, opacity .3s ease, padding .45s ease; }
  .services .service-card.is-open .service-zitat { max-height: 120px; opacity: 1; padding-top: 14px; }
  .services .service-zitat img { width: 46px; height: 46px; flex: none; border-radius: 50%; object-fit: cover; border: 2px solid #fff; }
  .services .service-zitat blockquote { margin: 0; color: #fff; font: italic 400 .98rem/1.35 'DM Serif Display', Georgia, serif; }
  .services .service-zitat cite { display: block; margin-top: 3px; font: normal 700 .66rem/1.2 'DM Sans', sans-serif; letter-spacing: .1em; text-transform: uppercase; opacity: .85; }
}
.person-close { z-index: 3; }
/* Team Fenster: ganzes Foto im Hochformat wie eine Karte */
.person { width: min(420px, calc(100% - 40px), calc((100svh - 240px) * .8)) !important; }
.person img { aspect-ratio: 4 / 5 !important; height: auto !important; max-height: none !important; object-fit: cover; object-position: center; }
/* Team Fenster: ohne Schließen Knopf, Antippen schließt */
.person-close { display: none !important; }
.person { cursor: pointer; outline: none; }