.ll-nl-t h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.sec-head.reveal h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.world.feature.reveal h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.world.span3.reveal h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.world.span4.reveal h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.member.reveal h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.panel-head h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.evmini.reveal h3{font-size:20px!important;line-height:26px!important}
.grid h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.cta.reveal h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.p-card h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.p-card.p-featured h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.p-proof-head h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.p-proof-body h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.p-wrap.p-split h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
.p-list h3{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}
.guide h2{font-size:clamp(20px, 18.51px + 0.38vw, 24px)!important;line-height:clamp(26px, 23.77px + 0.57vw, 32px)!important}

/* --- Kopfzeile der Unterseiten (header.topbar), 29.09.2026 ------------
   Founder: "Top menu auch gleich aufraeumen." Gemessen: Links brachen in
   zwei bis vier Zeilen ("Eat · Drink · Shop" senkrecht), oben statt mittig,
   Schriftzug klebte an "Home", EN/DE stiess an "Emergency". Nur Anordnung,
   kein Link entfernt. Startseite (header.site) unberuehrt. */
header.topbar .wrap.nav{display:flex;align-items:center;gap:24px;width:min(100% - 48px, 1440px);max-width:none;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
header.topbar .brand{flex:none}
header.topbar .navlinks{flex:1 1 auto;justify-content:center;align-items:center;flex-wrap:nowrap;gap:24px;min-width:0}
header.topbar .navlinks a{white-space:nowrap}
header.topbar .navright{flex:none;gap:16px}
header.topbar .lang{white-space:nowrap;padding:8px 12px;border:1px solid rgba(6,26,19,.16);border-radius:999px;background:transparent;line-height:16px}
@media (min-width:1200px){
  /* "List your business" steht als Knopf rechts; der gleiche Link in der Linkzeile doppelt ihn */
  header.topbar .navlinks .navcta{display:none}
}
@media (min-width:1200px) and (max-width:1599px){
  header.topbar .brand .bt{display:none}
  header.topbar .wrap.nav{gap:16px}
  header.topbar .navlinks{gap:16px}
  header.topbar .navright .btn-gold{padding-left:24px;padding-right:24px}
}
@media (min-width:1200px) and (max-width:1359px){
  header.topbar .navlinks{gap:12px;font-size:12px}
  header.topbar .navright .btn-gold{letter-spacing:.08em}
}
@media (min-width:1200px) and (max-width:1279px){
  header.topbar .wrap.nav{gap:12px}
  header.topbar .navlinks{gap:10px}
  header.topbar .navright{gap:8px}
  header.topbar .navright .btn-gold{padding-left:16px;padding-right:16px;letter-spacing:.04em}
}
/* Telefon: eine alte Regel (styles.css, "Mobile overflow tightening" 09.07.) blendete
   den ganzen rechten Block aus — damit auch den Menueknopf. Unterseiten waren am
   Telefon ohne Navigation. Menueknopf und Sprache zurueck, der Knopf bleibt aus. */
@media (max-width:520px){
  html body header.topbar .navright{display:flex!important;flex:0 0 auto;gap:8px;margin-left:auto}
  html body header.topbar .navright .btn-gold{display:none!important}
  html body header.topbar .lang{max-width:none!important;overflow:visible;padding:6px 10px;font-size:11px;border-radius:999px}
}

/* LL-KOPF-MOBIL (Freigabe Founder 29.09.2026): Auf Unterseiten mit header.site ueberlagerte bei 390 px die
   Wortmarke die Sprachwahl und „DE“ den Portal-Link. Unter 521 px traegt das LL-Zeichen allein die Marke;
   der Portal-Link ist doppelt (das Zeichen fuehrt schon zur Startseite). */
@media (max-width:520px){header.site .brand>span{display:none}header.site a.back{display:none}}

/* --- Startseite: Band "Coming up on the coast" (#grossereignisse), 29.09.2026 ---
   Founder: "zu viel Space ... da scrollt kaum jemand weiter. Sehr viel enger und
   eleganter. Das soll mehr wie ein Add-on sein — Special Event." Vorher ~620 px
   hoch (Kueste 288er-Bild + drei hohe Karten). Jetzt eine Zeile: Kueste links als
   schmaler Streifen, Ereignisse rechts als Liste. Kein Text geaendert. */
html body #grossereignisse{padding:32px 0;background:linear-gradient(90deg,#0a1e22 0%,#0e272b 100%);border-top:1px solid rgba(184,150,62,.24);border-bottom:1px solid rgba(184,150,62,.24)}
html body #grossereignisse > .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-areas:"kopf kopf" "kueste karten";column-gap:48px;row-gap:8px;align-items:center}
html body #grossereignisse .ge-kopf{grid-area:kopf;margin:0;align-items:baseline}
html body #grossereignisse h2{font-size:21px;line-height:27px}
html body #grossereignisse .ge-alle{font-size:13px;line-height:20px}
html body #grossereignisse .ge-rahmen{grid-area:kueste;margin:0;overflow:visible}
html body #grossereignisse .ge-kueste{min-width:0;width:100%}
html body #grossereignisse .ge-karten{grid-area:karten;display:flex;flex-direction:column;gap:0}
html body #grossereignisse .ge-karte{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;row-gap:0;align-items:baseline;
  padding:12px 0;border:0;border-top:1px solid rgba(184,150,62,.22);border-radius:0;background:none}
html body #grossereignisse .ge-karte:first-child{border-top:0}
html body #grossereignisse .ge-karte:target{background:rgba(184,150,62,.08)}
html body #grossereignisse .ge-ober{grid-column:1;font-size:10px;line-height:16px;letter-spacing:.24em}
html body #grossereignisse .ge-karte h3{grid-column:1;font-size:18px;line-height:24px}
html body #grossereignisse .ge-wann{grid-column:2;grid-row:1 / span 2;align-self:center;text-align:right;font-size:13px;line-height:20px;color:#e7c877;white-space:nowrap}
html body #grossereignisse .ge-ort{grid-column:1;font-size:13px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body #grossereignisse .ge-quelle{grid-column:2;text-align:right;padding-top:0;margin:0;font-size:11px;line-height:16px;opacity:.72;white-space:nowrap}
@media (max-width:900px){
  html body #grossereignisse{padding:24px 0}
  html body #grossereignisse > .wrap{grid-template-columns:1fr;grid-template-areas:"kopf" "kueste" "karten";row-gap:4px}
  html body #grossereignisse .ge-rahmen{overflow-x:auto}
  html body #grossereignisse .ge-kueste{min-width:560px;max-height:120px}
  html body #grossereignisse .ge-quelle{grid-column:1;text-align:left}
}
/* Enger: das Etikett "Highlight" steht auf jeder Zeile gleich und traegt nichts */
html body #grossereignisse{padding:24px 0}
html body #grossereignisse .ge-ober{display:none}
html body #grossereignisse .ge-karte{padding:8px 0}
html body #grossereignisse .ge-karte h3{grid-row:1}
@media (max-width:900px){
  html body #grossereignisse .ge-kueste{min-width:0;max-height:none}
  html body #grossereignisse .ge-rahmen{overflow:visible;margin:0 -8px}
}
html body #grossereignisse .ge-wann{grid-row:1;align-self:baseline}
html body #grossereignisse .ge-ort{grid-row:2}
html body #grossereignisse .ge-quelle{grid-row:2;align-self:baseline}
@media (max-width:900px){html body #grossereignisse .ge-quelle{display:none}}

/* ===== Ortsseiten (area-*.html) — Magazin statt Liste, 29.09.2026 =====
   Founder: "sieht alles aus wie eine Liste, langweilig, viel zu viel Space ...
   spielerischer, global best practice, perfekt fuer Auge und Besuchererlebnis."
   Gemessen vorher Sagres 5.294 px (Leitfaden 1.049, Karte 908). Nur Anordnung,
   kein Wort geaendert. Geltung: body:has(.ahero). Film-Kacheln auch auf events.html. */
html body:has(.ahero) section{scroll-margin-top:80px}
/* 1. Kopf: Bild bleibt Held, Eckdaten als Glasleiste im Bild */
html body:has(.ahero) .ahero{min-height:min(72vh,680px)}
html body:has(.ahero) .ahero .inner{padding-bottom:136px}
html body:has(.ahero) .glance{background:none;position:relative;z-index:3;margin-top:-104px}
html body:has(.ahero) .glance .row{background:none;gap:12px}
html body:has(.ahero) .glance .g{background:rgba(10,30,34,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(201,169,110,.32);border-radius:14px;padding:16px 16px;text-align:left}
html body:has(.ahero) .glance .g .gv{font-size:24px;line-height:32px}
html body:has(.ahero) .glance .g .gl{margin-top:4px;font-size:10px}
html body:has(.ahero) .ll-wx-band{padding:16px 0 0!important;background:none!important}
/* 2. Leitfaden: Ueberschrift links, Text rechts in zwei Spalten, erster Absatz als Aufmacher */
html body:has(.ahero) .guide{max-width:none;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);column-gap:48px;align-items:start}
html body:has(.ahero) .guide > .eyebrow,html body:has(.ahero) .guide > h2{grid-column:1}
html body:has(.ahero) .guide > h2{position:sticky;top:96px}
html body:has(.ahero) .guide > .g-en,html body:has(.ahero) .guide > .g-de{grid-column:2;grid-row:1 / span 3;columns:2;column-gap:40px}
html body:has(.ahero) .guide p{font-size:16px;line-height:26px;margin:0 0 16px;break-inside:avoid}
html body:has(.ahero) .guide p:first-of-type{column-span:all;font-family:var(--font-serif);font-size:24px;line-height:33px;color:#10262b;margin-bottom:24px}
html body:has(.ahero) .guide p:first-of-type::first-letter{font-size:72px;padding:8px 12px 0 0}
html body:has(.ahero) section:has(> .wrap > .guide){padding:64px 0 48px}
/* 3. Vor Ort empfohlen: Bildkarten */
html body:has(.ahero) section:has(.dgrid){padding:56px 0}
html body:has(.ahero) .dgrid{gap:24px}
html body:has(.ahero) .dcard{padding:0;border-radius:14px}
html body:has(.ahero) .dcard::before{display:none}
html body:has(.ahero) .dcard .dtop{display:block;margin:0}
html body:has(.ahero) .dcard .dmono{width:100%;height:auto;aspect-ratio:16/10;border-radius:0;background-size:cover;background-position:center}
html body:has(.ahero) .dcard .dtop > div:last-child{padding:16px 24px 0}
html body:has(.ahero) .dcard .ddesc,html body:has(.ahero) .dcard .dtags,html body:has(.ahero) .dcard .dmeta{margin-left:24px;margin-right:24px}
html body:has(.ahero) .dcard .ddesc{margin-top:8px}
html body:has(.ahero) .dcard .dmeta{margin-bottom:16px;margin-top:12px;padding-top:12px}
/* 4. Film: Text links, grosse Kachel mit Ortsbild rechts */
html body .ll-ard{padding:56px 0}
html body:has(.ahero) .ll-ard > .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:48px;align-items:center}
html body:has(.ahero) .ll-ard > .wrap > :not(.ll-ard-reihe){grid-column:1}
html body:has(.ahero) .ll-ard .ll-ard-reihe{grid-column:2;grid-row:1 / span 5;display:block}
html body:has(.ahero) .ll-ard h2{font-size:33px;line-height:40px}
html body .ll-ard-clip button{background-size:cover;background-position:center;transition:transform 420ms cubic-bezier(.16,1,.3,1)}
html body .ll-ard-clip:hover button{transform:scale(1.02)}
html body:has(.ahero) .ll-ard-clip .ll-ard-play{width:64px;height:64px;left:50%;top:50%;right:auto;transform:translate(-50%,-50%);background:rgba(10,30,34,.55);backdrop-filter:blur(6px)}
html body .ll-ard-clip button[aria-label$="Sagres"]{background-image:linear-gradient(0deg,rgba(6,20,23,.92),rgba(6,20,23,.18) 62%),url(/assets/img/area-sagres-hero.jpg)}
html body .ll-ard-clip button[aria-label$="Lagos"]{background-image:linear-gradient(0deg,rgba(6,20,23,.92),rgba(6,20,23,.18) 62%),url(/assets/img/area-lagos-hero.jpg)}
html body .ll-ard-clip button[aria-label$="Faro"]{background-image:linear-gradient(0deg,rgba(6,20,23,.92),rgba(6,20,23,.18) 62%),url(/assets/img/area-faro-hero.jpg)}
html body .ll-ard-clip button[aria-label$="Carvoeiro"]{background-image:linear-gradient(0deg,rgba(6,20,23,.92),rgba(6,20,23,.18) 62%),url(/assets/img/area-carvoeiro-hero.jpg)}
html body .ll-ard-clip button[aria-label$="Silves"]{background-image:linear-gradient(0deg,rgba(6,20,23,.92),rgba(6,20,23,.18) 62%),url(/assets/img/area-silves-hero.jpg)}
html body .ll-ard-clip button[aria-label$="Monchique"]{background-image:linear-gradient(0deg,rgba(6,20,23,.92),rgba(6,20,23,.18) 62%),url(/assets/img/area-monchique-hero.jpg)}
/* 5. Termine: ein waagrechter Streifen statt Kachelraster */
html body:has(.ahero) .aev{padding:48px 0}
html body:has(.ahero) .aevgrid{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin}
html body:has(.ahero) .aevc{flex:0 0 280px;scroll-snap-align:start;border-radius:14px;padding:16px}
/* 6. Anreise und Karte kompakt */
html body:has(.ahero) .lltr-sec{padding:32px 0!important}
html body:has(.ahero) .map-sec{padding:48px 0}
html body:has(.ahero) .map-sec .ehead{margin-bottom:24px}
html body:has(.ahero) .map-sec h2{font-size:33px!important;line-height:40px!important}
html body:has(.ahero) #map{height:400px;border-radius:14px}
@media (max-width:900px){
  html body:has(.ahero) .ahero .inner{padding-bottom:152px}
  html body:has(.ahero) .glance{margin-top:-128px}
  html body:has(.ahero) .glance .row{grid-template-columns:1fr 1fr;gap:8px}
  html body:has(.ahero) .glance .g{padding:12px}
  html body:has(.ahero) .glance .g .gv{font-size:18px;line-height:24px}
  html body:has(.ahero) .guide{display:block}
  html body:has(.ahero) .guide > h2{position:static}
  html body:has(.ahero) .guide > .g-en,html body:has(.ahero) .guide > .g-de{columns:1}
  html body:has(.ahero) .guide p:first-of-type{font-size:20px;line-height:28px}
  html body:has(.ahero) section:has(> .wrap > .guide){padding:40px 0 24px}
  html body:has(.ahero) section:has(.dgrid){padding:40px 0}
  html body:has(.ahero) .dgrid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px}
  html body:has(.ahero) .dcard{flex:0 0 82%;scroll-snap-align:start}
  html body:has(.ahero) .ll-ard > .wrap{display:block}
  html body .ll-ard{padding:40px 0}
  html body:has(.ahero) .ll-ard .ll-ard-reihe{margin:16px 0}
  html body:has(.ahero) .aev{padding:32px 0}
  html body:has(.ahero) .aevc{flex-basis:78%}
  html body:has(.ahero) .map-sec{padding:32px 0}
  html body:has(.ahero) #map{height:280px}
}
@media (prefers-reduced-motion:reduce){html body .ll-ard-clip button{transition:none}}
html body:has(.ahero) .ll-wx-band{background:#0a1e22!important;padding:12px 0!important}
html body:has(.ahero) .glance{background:linear-gradient(180deg,transparent 0,transparent 50%,#0a1e22 50%)}
html body:has(.ahero) .guide > h2{font-size:33px;line-height:40px;margin-top:8px}
html body:has(.ahero) .mlinks{padding:32px 0}
html body:has(.ahero) .mlinks .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
html body:has(.ahero) .mlinks .row a{padding:8px 16px;border:1px solid rgba(184,150,62,.45);border-radius:999px;font-size:14px;line-height:20px;color:#10262b;text-decoration:none}
html body:has(.ahero) .mlinks .row a:hover{background:#b8963e;color:#fff}
html body:has(.ahero) .guide > h2{font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important}
@media (max-width:900px){
  html body:has(.ahero) .glance .row{grid-template-columns:1fr 1fr!important}
  html body:has(.ahero) .ll-ard-clip .ll-ard-play{left:auto;right:16px;top:16px;transform:none;width:48px;height:48px}
  html body:has(.ahero) .ll-ard-clip button{padding:16px}
}
/* Veranstaltungsseite: kleine Kacheln, Text braucht mehr Abdunklung; Knopf bleibt oben rechts */
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label]{background-image:none}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Sagres"],html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Lagos"],
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Faro"],html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Carvoeiro"],
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Silves"],html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Monchique"]{background-blend-mode:normal}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Sagres"]{background-image:linear-gradient(0deg,rgba(6,20,23,.94),rgba(6,20,23,.72)),url(/assets/img/area-sagres-hero.jpg)}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Lagos"]{background-image:linear-gradient(0deg,rgba(6,20,23,.94),rgba(6,20,23,.72)),url(/assets/img/area-lagos-hero.jpg)}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Faro"]{background-image:linear-gradient(0deg,rgba(6,20,23,.94),rgba(6,20,23,.72)),url(/assets/img/area-faro-hero.jpg)}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Carvoeiro"]{background-image:linear-gradient(0deg,rgba(6,20,23,.94),rgba(6,20,23,.72)),url(/assets/img/area-carvoeiro-hero.jpg)}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Silves"]{background-image:linear-gradient(0deg,rgba(6,20,23,.94),rgba(6,20,23,.72)),url(/assets/img/area-silves-hero.jpg)}
html body:not(:has(.ahero)) .ll-ard-clip button[aria-label$="Monchique"]{background-image:linear-gradient(0deg,rgba(6,20,23,.94),rgba(6,20,23,.72)),url(/assets/img/area-monchique-hero.jpg)}
/* Zweispaltig gleich hoch (Founder 29.09.: "zweispaltig besser leveln"): Absaetze duerfen umbrechen */
html body:has(.ahero) .guide p{break-inside:auto;orphans:3;widows:3}
html body:has(.ahero) .guide > .g-en,html body:has(.ahero) .guide > .g-de{column-fill:balance}

/* ===== Bereichsseiten (services, golf, property, health-beauty, home-interiors,
   local-living) — dieselbe Magazin-Logik wie die Ortsseiten, 29.09.2026 =====
   Founder: "Dann fuer alle Bereiche uebernehmen." Vorher: drei gleiche Spalten,
   services 10.234 px. Jetzt Bento: je Gruppe ein Aufmacher 2x2, sonst vier
   Spalten, Bild oben, enger. Nur Anordnung. Geltung: body:has(.bizgrid). */
html body:has(.bizgrid) .grp{margin-bottom:48px}
html body:has(.bizgrid) .grp > h2{display:flex;align-items:center;gap:16px;font-size:clamp(24px, 20.66px + 0.86vw, 33px)!important;line-height:clamp(30px, 26.29px + 0.95vw, 40px)!important;margin:0 0 24px}
html body:has(.bizgrid) .grp > h2::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(184,150,62,.6),rgba(184,150,62,0))}
html body:has(.bizgrid) .bizgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;grid-auto-flow:dense}
html body:has(.bizgrid) .biz{border-radius:14px;transition:transform 200ms cubic-bezier(.25,1,.5,1),box-shadow 200ms cubic-bezier(.25,1,.5,1)}
html body:has(.bizgrid) .biz:hover{transform:translateY(-4px);box-shadow:0 24px 48px -24px rgba(16,38,42,.4)}
html body:has(.bizgrid) .biz.has-photo .ic{height:auto;aspect-ratio:16/10}
html body:has(.bizgrid) .biz.has-photo .cat{margin:12px 16px 0}
html body:has(.bizgrid) .biz.has-photo h3,html body:has(.bizgrid) .biz.has-photo p{padding-inline:16px}
html body:has(.bizgrid) .biz h3{font-size:18px;line-height:24px}
html body:has(.bizgrid) .biz p{font-size:14px;line-height:21px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
html body:has(.bizgrid) .biz.has-photo .meta{margin:12px 16px 16px;padding-top:8px}
/* Aufmacher: die erste Karte mit Foto je Gruppe, gross mit Text im Bild */
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)){grid-column:span 2;grid-row:span 2;position:relative;border:0;color:#fff;min-height:420px;justify-content:flex-end}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) > .ic{position:absolute;inset:0;height:100%;aspect-ratio:auto}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen))::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,30,34,.92),rgba(10,30,34,.1) 60%);z-index:0}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) > :not(.ic){position:relative;z-index:1}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) h3{font-size:27px;line-height:32px;color:#fff}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) p{flex:0;color:rgba(255,255,255,.86);font-size:15px;line-height:22px}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) .cat{color:#e7c877}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) .meta{border-top-color:rgba(255,255,255,.24)}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) .area,
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) .go{color:#fff}
@media (max-width:1199px){html body:has(.bizgrid) .bizgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){
  html body:has(.bizgrid) .bizgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px}
  html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)){min-height:320px}
  html body:has(.bizgrid) .biz p{-webkit-line-clamp:2}
  html body:has(.bizgrid) .grp{margin-bottom:32px}
}
@media (max-width:520px){
  html body:has(.bizgrid) .biz h3{font-size:16px;line-height:21px}
  html body:has(.bizgrid) .biz.has-photo .cat{margin:8px 12px 0}
  html body:has(.bizgrid) .biz.has-photo h3,html body:has(.bizgrid) .biz.has-photo p{padding-inline:12px}
  html body:has(.bizgrid) .biz.has-photo .meta{margin:8px 12px 12px}
}
@media (prefers-reduced-motion:reduce){html body:has(.bizgrid) .biz{transition:none}}
/* Aufmacher als Querkarte (2 Spalten, 1 Zeile): Bild links, Text rechts — robust auch bei schwachen Fotos */
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)){grid-row:span 1;min-height:0;display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto 1fr auto;border:1px solid var(--line);color:inherit;background:#0a1e22}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen))::after{display:none}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) > .ic{position:relative;inset:auto;grid-column:1;grid-row:1 / -1;height:100%;min-height:100%;aspect-ratio:auto}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) > :not(.ic){grid-column:2}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) .cat{margin-top:24px}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) h3{font-size:24px;line-height:30px}
html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) p{-webkit-line-clamp:5}
@media (max-width:520px){
  html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)){grid-template-columns:1fr;grid-template-rows:auto}
  html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) > .ic{grid-row:auto;aspect-ratio:16/10;height:auto}
  html body:has(.bizgrid) .bizgrid > .biz.has-photo:first-child:has(> .ic:not(.ll-firmenlogo):not(.ll-zeichen)) > :not(.ic){grid-column:1}
}

/* Karte am Telefon grau (Founder 29.09.2026, Screenshot Faro): styles.css "Mobile Leaflet
   map clamp" (09.07.) setzt overflow:hidden auf .leaflet-pane/.leaflet-tile-pane/.leaflet-layer.
   Diese Ebenen sind 0x0 gross — alles darin wird weggeschnitten. Nur der Container clippt. */
@media (max-width:700px){
  html body .leaflet-container .leaflet-pane,
  html body .leaflet-container .leaflet-tile-pane,
  html body .leaflet-container .leaflet-layer,
  html body .leaflet-container .leaflet-tile-container{overflow:visible!important;max-width:none!important}
}

/* Startseite "Seven ways": die letzte Karte (Verzeichnis) stand allein, 8 von 12 Spalten leer
   (Founder 29.09.: "Den Space optimieren"). Untere Reihe: vier Karten je 3 Spalten. */
@media (min-width:901px){
  html body #worlds .worlds > .world.span4{grid-column:span 3}
  html body #worlds{padding-bottom:40px}
  html body #members{padding-top:40px}
}

/* Vollprüfung 04.10.2026 (WCAG 1.4.3): Der KI-Hinweis stand mit Deckkraft .62 unter 4,5:1. Design */
.ai-act-disclosure{opacity:.86!important}
/* Kleine Ziffern in Gold auf Creme erreichten 2,5:1; wie die Versalien vom 03.10. in der Hausfarbe --muted. */
.p-list span{color:var(--muted,#33474a)!important}
/* Fußzeile: Deckkraft .45 ergab 4,25:1. */
.fbar{color:rgba(250,250,248,.62)!important}
/* Sprachlinks DE/PT im Datenfuß waren 20×16 px; WCAG 2.5.8 verlangt 24×24. */
.ll-daten-fuss li a[hreflang]{display:inline-block;min-width:24px;min-height:24px;text-align:center}