/* www.lindana-photographie.de – Gestaltung wie die bisherige Squarespace-Seite (Board 24.10.2026: „So sollte es aussehen – Fonts,
   Platzierung des Logos usw.“), gemessen am ausgelieferten Squarespace-DOM bei 390 und 1440 px: transparenter Kopf über dem Kopffoto
   mit 220 px hohem Herz-Logo (Handy 100 px), Menü in Garamond rechts, Facebook/Instagram als umrandete Quadrate, Grund #dfe0e1,
   Text Adobe Garamond 19,5 px / 1,6 (hier EB Garamond), Überschriften Orpheus (hier Cormorant Garamond), eckige schwarze Knöpfe.
   Dazu „à la Apple“: Kopf kommt beim Zurückscrollen kompakt wieder, sanftes Einblenden, Großansicht. Vorlage: www.weichert.at (OWL-2286). */
@font-face { font-family: 'Inter'; src: url('/fonts/inter.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }

:root {
  --schrift: 'adobe-garamond-pro', 'EB Garamond', Garamond, Georgia, serif;
  --grund: #dfe0e1; --text: #000; --text2: #4a4a4d; --linie: rgba(0, 0, 0, .22); --grau: #dfe0e1; --akzent: #8fd3cc; --akzent-dunkel: #237a74;
  --rand: 4vw; --max: 1800px; --radius: 12px;
  /* Kopf wie live: Logo 220 px, oben/unten je 3vw (Handy: 100 px, je 6vw) */
  --logo: 220px; --kopf-pad: 3vw; --kopf-h: calc(var(--logo) + 2 * var(--kopf-pad));
  /* live: Text 18,0 / 19,5 / 20,3 px und H2 34,2 / 47,1 / 54,9 px bei 390 / 1440 / ab 1920 px Breite */
  --gr-text: clamp(17px, calc(17.5px + .136vw), 20.32px);
  --gr-h1: clamp(38px, calc(42.4px + 1.766vw), 79px);
  --gr-h2: clamp(30px, calc(29.45px + 1.226vw), 54.88px);
  --gr-h3: clamp(24px, calc(21px + .7vw), 36px);
  --text-breite: min(max(990px, 68.8vw), 1347px);
}
@media (max-width: 767px) { :root { --logo: 100px; --kopf-pad: 6vw; --rand: 6vw; } }
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 100px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
body { margin: 0; font-family: var(--schrift), 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji'; font-size: var(--gr-text); line-height: 1.6; color: var(--text); background: var(--grund); -webkit-font-smoothing: antialiased; overflow-x: clip; }
body.dunkel { background: #000; color: #f5f5f7; }
h1, h2, h3, h4, .knopf { font-family: var(--schrift-titel, var(--schrift)); }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fliess a, .meta a, .unterzeile a, .hinweis-klein a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
h1, h2, h3, h4 { margin: 0; font-weight: 400; letter-spacing: 0; line-height: 1.25; hyphens: manual; overflow-wrap: normal; word-break: normal; text-wrap: balance; }
h1 strong, h2 strong, h3 strong, h4 strong { font-weight: inherit; }
p { margin: 0 0 1em; }
.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--rand); }
.wrap.breit { max-width: none; }
.wrap.schmal { max-width: 820px; }
.wrap.breit-inhalt { max-width: 1440px; }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 100; background: #fff; color: #000; padding: 8px 14px; }
.skip:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--akzent-dunkel); outline-offset: 2px; }

/* ---------- Hinweisleiste ---------- */
.hinweisleiste { margin: 0; background: #000; color: #fff; text-align: center; font-size: 15px; padding: 8px var(--rand); }
.hinweisleiste a { color: inherit; }

/* ---------- Kopf: liegt transparent über dem Kopffoto (live: Squarespace-Kopf „Full“, Logo 220 px, Abstand 3vw/4vw) ---------- */
.kopf { position: absolute; top: 0; left: 0; right: 0; z-index: 50; color: #000; }
.kopf-weiss .kopf { color: #fff; }
.kopf-leiste { display: flex; align-items: center; gap: max(12px, 1vw); padding: var(--kopf-pad) var(--rand); }
.marke { display: inline-flex; flex: none; margin-right: auto; }
.marke img { height: var(--logo); width: auto; transition: height .35s cubic-bezier(.2, .7, .2, 1); }
.menue { list-style: none; margin: 0 0 0 auto; padding: 0; display: flex; align-items: center; gap: max(12px, 1vw); }
.menue > li { position: relative; }
.menue-punkt { display: block; padding: 2px 0; font: inherit; font-family: var(--schrift); font-size: var(--gr-text); line-height: 1.6; color: inherit; background: none; border: 0; cursor: pointer; white-space: nowrap; text-decoration: none !important; }
.menue-punkt:hover, .menue-punkt[aria-current], .menue-punkt[data-aktiv] { background: linear-gradient(currentColor, currentColor) 0 calc(100% - 1px) / 100% 1px no-repeat; }
/* „Photos“ und „Shops“: schwarze Liste unter dem Menüpunkt, rechtsbündig (live) */
.menue-liste { position: absolute; top: 100%; right: -20px; min-width: max-content; list-style: none; margin: 6px 0 0; padding: 12px 20px 16px; background: #000; color: #fff; text-align: right;
  opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .2s ease, transform .2s ease, visibility .2s; }
body:not(.kopf-weiss) .menue-liste { background: var(--grund); color: #000; }
.hat-liste.offen .menue-liste { opacity: 1; visibility: visible; transform: none; }
.menue-liste a { display: block; padding: 2px 0; font-size: var(--gr-text); line-height: 1.5; white-space: nowrap; }
.menue-liste a[aria-current] { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.kopf-knopf { margin-left: 6px; padding: 12px 22px; background: currentColor; font-family: var(--schrift-titel, var(--schrift)); font-size: 16px; white-space: nowrap; text-decoration: none !important; }
/* Facebook / Instagram oben rechts: umrandete Quadrate 44 px (live) */
.kopf-sozial { display: flex; gap: max(7px, .5vw); flex: none; }
.kopf-sozial a, .mobil-sozial a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1.5px solid currentColor; border-radius: 8px; color: inherit; transition: background .2s, color .2s; }
.kopf-sozial a:hover { background: currentColor; }
.kopf-sozial a:hover svg { color: #000; } body:not(.kopf-weiss) .kopf-sozial a:hover svg { color: var(--grund); }
.kopf-sozial svg, .mobil-sozial svg { width: 22px; height: 22px; }
/* Beim Weiterscrollen verschwindet der Kopf, beim Zurückscrollen kommt er kompakt mit Hintergrund wieder (live: „Scroll Back“) */
.kopf.fest { position: fixed; background: var(--grund); transform: translateY(-100%); transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.kopf-weiss .kopf.fest { background: #000; }
.kopf.fest.auf { transform: none; box-shadow: 0 1px 0 rgba(0, 0, 0, .08); }
.kopf.fest .kopf-leiste { padding-top: 10px; padding-bottom: 10px; }
.kopf.fest .marke img { height: min(var(--logo), 84px); }
/* Menüsymbol (zwei Linien wie live), sobald das Menü nicht mehr neben das Logo passt (site.js misst; ohne JavaScript feste Grenze) */
.burger { display: none; margin-left: auto; width: 48px; height: 48px; background: none; border: 0; cursor: pointer; position: relative; color: inherit; }
.burger span { position: absolute; left: 6px; right: 6px; height: 1.5px; background: currentColor; transition: transform .25s ease; }
.burger span:first-child { top: 19px; } .burger span:last-child { top: 28px; }
.burger[aria-expanded="true"] span:first-child { transform: translateY(4.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child { transform: translateY(-4.5px) rotate(-45deg); }
.kopf.menue-auf { position: fixed; inset: 0; transform: none; background: var(--grund); overflow-y: auto; }
.kopf-weiss .kopf.menue-auf { background: #000; }
.mobil-menue { padding: 4vh var(--rand) 48px; text-align: center; }
.mobil-menue ul { list-style: none; margin: 0; padding: 0; }
.mobil-menue > ul > li > a, .mobil-menue summary { display: block; color: inherit; font-size: clamp(24px, 6vw, 32px); line-height: 1.3; padding: 8px 0; cursor: pointer; list-style: none; text-decoration: none !important; }
.mobil-menue summary::-webkit-details-marker { display: none; }
.mobil-menue details ul { padding: 0 0 10px; }
.mobil-menue details a { display: block; font-size: 20px; padding: 4px 0; opacity: .85; }
.mobil-menue .kopf-knopf { display: inline-block; margin: 18px 0 0; }
.mobil-sozial { display: flex; justify-content: center; gap: 10px; margin: 24px 0 0; }
.kopf.eng .menue, .kopf.eng .kopf-sozial, .kopf.eng .kopf-leiste > .kopf-knopf { display: none; } .kopf.eng .burger { display: block; }
.kopf:not(.eng) .mobil-menue { display: none !important; }
@media (max-width: 1100px) { .menue, .kopf-sozial, .kopf-leiste > .kopf-knopf { display: none; } .burger { display: block; } }

/* ---------- Knöpfe: eckig, schwarz, Titelschrift 16 px (live: primary-button-shape-square, 19,2 × 32 px Innenabstand) ---------- */
.knopf { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 19px 32px; border-radius: 0; background: #000; color: #fff !important; font-size: 16px; font-weight: 500; letter-spacing: .04em; line-height: 1.2; text-align: center; border: 0; cursor: pointer; text-decoration: none !important; transition: opacity .2s, transform .2s; }
.knopf:hover { opacity: .8; }
.knopf:active { transform: scale(.98); }
.knopf.hell { background: transparent; color: inherit !important; box-shadow: inset 0 0 0 1px currentColor; }
.knopf.hell:hover { background: rgba(0, 0, 0, .06); opacity: 1; }
.stil-dunkel .knopf:not(.hell), .buehne .knopf:not(.hell), body.dunkel .knopf:not(.hell) { background: #fff; color: #000 !important; }
.knopf-zeile { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 28px 0; }
.knopf-zeile.klein { margin: 14px 0 0; justify-content: flex-start; }
.pillen { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; justify-content: center; }
.pillen a { padding: 2px 0; font-size: var(--gr-text); color: inherit; text-decoration: none !important; }
.pillen a:hover, .pillen a[aria-current] { background: linear-gradient(currentColor, currentColor) 0 calc(100% - 1px) / 100% 1px no-repeat; }
.pillen.hell { justify-content: flex-start; margin-bottom: 32px; }
.galerie-seite .pillen.hell { justify-content: center; margin: 0; }
.pillen small { opacity: .6; margin-left: 2px; }

/* ---------- Bühne: Kopffoto über die volle Breite, Kopf liegt darüber; 66 % der Fensterhöhe, Titel mittig unter dem Kopf (live) ---------- */
.buehne { position: relative; min-height: max(66vh, calc(var(--kopf-h) + 200px)); padding: var(--kopf-h) 0 clamp(28px, 3vw, 48px); display: flex; align-items: center; overflow: hidden; background: #000; color: #fff; text-align: center; }
.buehne.ohne-foto { min-height: 0; padding-bottom: clamp(48px, 5vw, 80px); }
.buehne-bild { position: absolute; inset: 0; }
.buehne-bild img { width: 100%; height: 100%; object-fit: cover; }
/* live: Abdunkelung 2–15 %, der Titel steht ohne Verlauf direkt auf dem Foto */
.buehne::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .1); }
.buehne-text { position: relative; z-index: 1; }
.buehne h1 { font-size: var(--gr-h1); line-height: 1.23; animation: einblenden 1s .1s cubic-bezier(.2, .7, .2, 1) both; }
.buehne.start h1 { font-size: var(--gr-h2); line-height: 1.3; }
.buehne-text p, .buehne-text h2, .buehne-text h3 { font-size: var(--gr-text); line-height: 1.6; margin: 16px auto 0; max-width: 46ch; animation: einblenden 1s .25s cubic-bezier(.2, .7, .2, 1) both; }
.buehne-text h2, .buehne-text h3 { font-size: var(--gr-h3); }
.buehne-text [style*="text-align: center"] { margin-inline: auto; }
.buehne .knopf-zeile { margin: 32px 0 0; animation: einblenden 1s .4s cubic-bezier(.2, .7, .2, 1) both; }
.buehne-weiter { display: none; }
@keyframes einblenden { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@supports (animation-timeline: view()) {
  .buehne .buehne-bild img { animation: buehne-parallax linear both; animation-timeline: view(); animation-range: exit; }
  @keyframes buehne-parallax { to { transform: translateY(14%) scale(1.04); } }
}

/* ---------- Abschnitte: Grund #dfe0e1 wie live; „Weiß“ und „Schwarz“ wählbar ---------- */
.band { padding: clamp(40px, 4vw, 64px) 0; }
.band.eng { padding: clamp(28px, 3vw, 48px) 0; }
.stil-grau { background: var(--grund); }
.stil-hell { background: #fff; }
.stil-dunkel, .band.dunkel { background: #000; color: #f5f5f7; }
/* Seiten ohne Kopffoto: Inhalt beginnt unter dem Kopf (live: Vita) */
main > .band:first-child, main > .kopfband:first-child, main > .artikel:first-child { padding-top: calc(var(--kopf-h) + clamp(16px, 2vw, 40px)); }
.kopfband { padding: clamp(40px, 5vw, 72px) 0 clamp(16px, 2vw, 32px); text-align: center; }
.kopfband.dunkel { background: #000; color: #f5f5f7; }
.kopfband h1 { font-size: var(--gr-h1); }
.kopfband .unterzeile { margin: 10px 0 0; }
.dachzeile { font-size: 15px; letter-spacing: .04em; color: var(--akzent-dunkel); margin: 0 0 10px; }
.dunkel .dachzeile { color: var(--akzent); }
.dachzeile a { color: inherit !important; }
.leer { color: var(--text2); }
.hinweis-klein { font-size: 15px; color: var(--text2); margin-top: 14px; }
.stil-dunkel .hinweis-klein, .dunkel .hinweis-klein { color: #a1a1a6; }

/* Einblenden beim Scrollen (site.js setzt .sichtbar) */
.js .zeigen { opacity: 0; transform: translateY(24px); transition: opacity .8s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--v, 0) * 80ms); }
.js .zeigen.sichtbar { opacity: 1; transform: none; }

/* ---------- Fließtext: Garamond 19,5 px / 1,6, Überschriften Orpheus-Gegenstück (live) ---------- */
.fliess { font-size: var(--gr-text); line-height: 1.6; max-width: var(--text-breite); margin: 0 auto 1em; text-wrap: pretty; }
.fliess:last-child { margin-bottom: 0; }
.fliess > :last-child { margin-bottom: 0; }
.fliess h1, .fliess h2 { font-size: var(--gr-h2); line-height: 1.3; margin: 0 0 .5em; }
.fliess h3 { font-size: var(--gr-h3); line-height: 1.3; margin: 1.2em 0 .5em; }
.fliess h4 { font-size: var(--gr-text); line-height: 1.4; margin: 1.2em 0 .4em; }
.fliess > :first-child { margin-top: 0; }
.fliess ul, .fliess ol { padding-left: 1.3em; margin: 0 0 1em; }
.fliess li { margin: .3em 0; }
.fliess li[style*="center"] { list-style-position: inside; }
.fliess a { overflow-wrap: anywhere; }
.fliess blockquote { margin: 1.2em 0; padding-left: 18px; border-left: 2px solid currentColor; }
.fliess [style*="text-align: justify"] { hyphens: manual; text-justify: inter-word; }
.stil-dunkel .fliess { color: #f5f5f7; }
.trenner { border: 0; border-top: 1px solid currentColor; margin: 48px 0; }

/* ---------- Spalten (live nebeneinander) und Karten (z. B. Fotopakete) ---------- */
.spalten { display: grid; gap: clamp(20px, 3vw, 36px); margin: 36px 0; align-items: start; }
.spalten.s2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.spalten.s3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.spalten.s4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.spalte > .fliess { max-width: none; }
.spalte .block-bild { margin: 0 0 18px; }
.spalte .fliess h2 { font-size: var(--gr-h3); }
.spalte .fliess h3 { font-size: clamp(21px, 2vw, 26px); margin-top: 0; }
/* Karten (Fotopakete auf „Shootings & Preise“): wie live ohne Kasten – Foto mit runden Ecken, Titel, Umfang/Preis zum Aufklappen */
.spalten.karten { align-items: stretch; }
.spalten.karten .spalte { display: flex; flex-direction: column; }
.spalten.karten .block-bild { margin: 0; overflow: hidden; border-radius: 20px; }
.spalten.karten .block-bild img { aspect-ratio: 3 / 2; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.spalten.karten .spalte:hover .block-bild img { transform: scale(1.03); }
.spalten.karten .fliess { margin: 16px 0 0; }
.spalten.karten .fliess + .fliess { margin-top: 8px; }
.spalten.karten .fliess h2, .spalten.karten .fliess h3, .spalten.karten .fliess h4 { font-size: var(--gr-text); margin: 0; }
.spalten.karten .knopf-zeile { margin: auto 0 0; padding-top: 18px; }
@media (max-width: 900px) { .spalten.s3, .spalten.s4 { grid-template-columns: 1fr; } .spalten.s3.karten { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); } }
@media (max-width: 700px) { .spalten.s2 { grid-template-columns: 1fr; } }

/* ---------- Bilder ---------- */
.block-bild { margin: 32px auto; max-width: 1100px; }
.block-bild img { border-radius: var(--radius); width: 100%; }
.block-bild > a { display: block; }
.block-bild.schmal img { border-radius: 50px; }
.block-bild.mit-format img { aspect-ratio: var(--format); object-fit: cover; }
.block-bild figcaption { margin-top: 10px; font-size: 16px; color: var(--text2); text-align: center; }
.block-bild figcaption strong { display: block; color: var(--text); font-size: var(--gr-text); }
.lb-einzel { cursor: zoom-in; }

/* Überblendung (Board 24.10.2026: Vorher/Nachher als Wechselbild, alle 3 Sekunden, zentriert) */
.wechsel { position: relative; max-width: 1100px; margin: 32px auto; aspect-ratio: var(--r, 1.5); border-radius: var(--radius); overflow: hidden; background: #e8e8ed; }
.wechsel > a { position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease; cursor: zoom-in; }
.wechsel > a.aktiv { opacity: 1; z-index: 1; }
.wechsel > a img { width: 100%; height: 100%; object-fit: cover; }
.wechsel-marke { position: absolute; left: 18px; top: 18px; padding: 6px 14px; border-radius: 980px; background: rgba(0, 0, 0, .62); color: #fff; font-size: 14px; font-weight: 600; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

/* Diashow: großer Bildstreifen zum Wischen (wie die Produktgalerien auf apple.com) */
.diashow { margin: 32px calc(var(--rand) * -1); }
.diashow-spur { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 var(--rand); padding: 4px var(--rand) 8px; scrollbar-width: none; overscroll-behavior-x: contain; }
.diashow-spur::-webkit-scrollbar { display: none; }
.diashow-spur > a { flex: none; height: min(clamp(260px, 56vh, 640px), calc(88vw / var(--r))); aspect-ratio: var(--r); scroll-snap-align: start; border-radius: 16px; overflow: hidden; background: #e8e8ed; cursor: zoom-in; }
.diashow-spur > a img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.diashow-spur > a:hover img { transform: scale(1.03); }
.scroller-knoepfe { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin: 16px var(--rand) 0; }
.scroller-knoepfe .zaehler { margin-right: auto; font-size: 14px; color: var(--text2); }
.scroller-knoepfe button { width: 40px; height: 40px; border-radius: 50%; border: 0; background: #e8e8ed; color: var(--text); cursor: pointer; display: grid; place-items: center; }
.stil-grau .scroller-knoepfe button { background: #fff; }
.scroller-knoepfe button:disabled { opacity: .4; cursor: default; }
.scroller-knoepfe svg { width: 18px; height: 18px; }
@media (min-width: 1800px) { .diashow { margin-inline: calc((100vw - var(--max)) / -2 - var(--rand)); } }

/* ---------- Portfolio-Galerie wie live (Board 24.10.2026): Mauerwerk über die volle Breite, 4 Spalten (Handy 2), Abstand 0,25vw,
   jedes Foto in die gerade kürzeste Spalte (Squarespace „Masonry“, Regel in site.js). site.js setzt die Positionen; ohne JavaScript ein einfaches Raster. ---------- */
.band.galerie { --g-abstand: .25vw; padding: 0; }
.band.galerie + .band.galerie { padding-top: 0; }
.band.galerie .wrap.breit { padding: 0; }
.justiert:not(.mauer) { padding: var(--g-abstand); }
.galerie-titel { font-size: var(--gr-h2); margin: 24px 0; text-align: center; }
.justiert { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--g-abstand); }
@media (max-width: 767px) { .justiert { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.justiert > a { position: relative; display: block; aspect-ratio: var(--r); background: #cfd0d1; z-index: 0; transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s; }
.justiert.mauer { display: block; position: relative; }
.justiert.mauer > a { position: absolute; aspect-ratio: auto; }
.justiert > a > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Überfahren: Foto wächst auf doppelte Größe über die Nachbarn; Klick öffnet die Großansicht. Außenspalten wachsen nach innen. */
@media (hover: hover) and (pointer: fine) {
  .justiert > a { cursor: zoom-in; }
  .justiert > a[data-spalte="l"] { transform-origin: left center; }
  .justiert > a[data-spalte="r"] { transform-origin: right center; }
  .justiert > a:hover { transform: scale(2); z-index: 5; box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }
}
.js .justiert > a.kommt { opacity: 0; translate: 0 26px; }
.js .justiert > a.da { opacity: 1; translate: 0 0; transition: opacity .7s ease, translate .7s cubic-bezier(.2, .7, .2, 1), transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s; }

/* Portfolio-Überblick */
.bereiche { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.bereiche a { position: relative; display: block; aspect-ratio: 16 / 10; border-radius: var(--radius); overflow: hidden; color: #fff !important; text-decoration: none !important; background: #cfd0d1; }
.bereich-bild, .bereich-bild img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bereich-bild img { transition: transform .9s cubic-bezier(.2, .7, .2, 1); }
.bereiche a:hover .bereich-bild img { transform: scale(1.05); }
.bereiche a::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(0, 0, 0, .7)); }
.bereich-text { position: absolute; z-index: 1; left: 28px; right: 28px; bottom: 24px; }
.bereich-text h2 { font-size: var(--gr-h2); }
.bereich-text span { display: block; margin-top: 2px; color: rgba(255, 255, 255, .85); font-size: 16px; }
@media (max-width: 760px) { .bereiche { grid-template-columns: 1fr; } }

/* Referenzen: Logos auf gleich großen weißen Kacheln */
.logo-kacheln { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); gap: 16px; }
.logo-kacheln li { height: 130px; overflow: hidden; background: #fff; border-radius: 16px; display: grid; place-items: center; padding: 16px 20px; box-shadow: 0 2px 10px rgba(0, 0, 0, .06); transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s; }
.logo-kacheln li:hover { transform: translateY(-4px) scale(1.03); box-shadow: 0 14px 34px rgba(0, 0, 0, .12); }
.logo-kacheln img { max-width: 100%; max-height: 96px; width: auto; height: auto; object-fit: contain; }
.stil-hell .logo-kacheln li { background: var(--grau); box-shadow: none; }
.stil-hell .logo-kacheln img { mix-blend-mode: multiply; }

/* Team (About) */
.karten-titel { text-align: center; font-size: var(--gr-h2); margin: 0 0 40px; }
.personen { list-style: none; margin: 0 auto; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 48px 32px; max-width: 900px; text-align: center; }
.person-bild { aspect-ratio: 4 / 5; border-radius: var(--radius); overflow: hidden; background: var(--grau); margin-bottom: 20px; }
.person-bild img { width: 100%; height: 100%; object-fit: cover; }
.personen h3 { font-size: var(--gr-h3); }
.personen .fliess { color: var(--text2); margin-top: 6px; }
.personen .knopf-zeile { margin: 18px 0 0; }

/* FAQ */
.faq { max-width: 860px; margin: 0 auto; border-top: 1px solid var(--linie); }
.faq details { border-bottom: 1px solid var(--linie); }
.faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 0; font-size: var(--gr-text); }
.faq summary strong { font-weight: inherit; }
.faq summary::-webkit-details-marker { display: none; }
/* Pfeil nach unten wie im Squarespace-Akkordeon */
.faq summary::after { content: ''; flex: none; width: 9px; height: 9px; margin-right: 4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-3px) rotate(45deg); transition: transform .3s; }
.faq details[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.faq .fliess { padding: 0 0 18px; margin: 0; }

/* ---------- Formulare ---------- */
.formular { display: grid; gap: 16px; max-width: 720px; margin: 28px auto; background: #fff; padding: clamp(22px, 4vw, 40px); border-radius: 0; color: var(--text); text-align: left; }
.stil-dunkel .formular { background: #1d1d1f; color: #f5f5f7; }
.formular label, .formular legend { display: grid; gap: 6px; font-size: 17px; }
.formular .pflicht { font-weight: 400; color: var(--text2); font-size: 13px; }
.formular input:not([type="checkbox"]), .formular textarea { font: inherit; font-size: 17px; padding: 13px 15px; border: 1px solid var(--linie); border-radius: 0; background: #fff; color: var(--text); width: 100%; }
.formular textarea { min-height: 170px; resize: vertical; }
.formular input:focus, .formular textarea:focus { outline: none; border-color: var(--text); box-shadow: 0 0 0 4px rgba(0, 0, 0, .08); }
.stil-dunkel .formular input:not([type="checkbox"]), .stil-dunkel .formular textarea { background: #000; color: #f5f5f7; border-color: #424245; }
.feld-gruppe { border: 0; margin: 0; padding: 0; display: grid; gap: 12px; min-width: 0; }
.feld-gruppe legend { padding: 0; margin-bottom: 10px; font-size: 17px; font-weight: 600; }
.formular-zwei { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
@media (max-width: 640px) { .formular-zwei { grid-template-columns: 1fr; } }
.formular .haken { display: flex; align-items: center; gap: 10px; font-weight: 400; font-size: 16px; cursor: pointer; }
.formular .haken input { width: 20px; height: 20px; accent-color: #000; flex: none; }
.formular .knopf { justify-self: start; }
.stil-dunkel .formular .knopf { background: #f5f5f7; color: #1d1d1f !important; }
.honig { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.formular .hinweis-klein { margin: 0; }
.meldung { padding: 12px 16px; border-radius: 0; margin: 0; font-weight: 500; }
.meldung.ok { background: #e3f6e8; color: #0b6b2a; }
.meldung.fehler { background: #fde8e8; color: #9b1c1c; }

/* Karte, Soziale Netzwerke, Video */
.karte-osm { height: clamp(320px, 44vw, 720px); border-radius: 0; overflow: hidden; background: var(--grau); }
.karte-osm iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(1); }
.sozial { list-style: none; margin: 18px 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.spalte .sozial { justify-content: flex-start; }
.sozial a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(127, 127, 127, .14); color: inherit !important; transition: background .2s; }
.sozial a:hover { background: rgba(127, 127, 127, .26); }
.sozial svg { width: 20px; height: 20px; }
.video { aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: #111; max-width: 1100px; margin: 32px auto 0; }
.video button { all: unset; cursor: pointer; display: block; position: relative; width: 100%; height: 100%; }
.video button img { width: 100%; height: 100%; object-fit: cover; }
.video .play { position: absolute; inset: 0; display: grid; place-items: center; }
.video .play svg { width: 84px; height: 84px; }
.video iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ---------- Blog ---------- */
.raster-karten { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 36px 24px; }
.karte a { display: block; color: inherit !important; text-decoration: none !important; }
.karte-bild { aspect-ratio: 3 / 2; border-radius: var(--radius); overflow: hidden; background: #e8e8ed; }
.karte-bild img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.karte a:hover .karte-bild img { transform: scale(1.04); }
.karte-leer { width: 100%; height: 100%; background: linear-gradient(135deg, #2c2c2e, #000); }
.karte-text { padding: 16px 2px 0; }
.karte-text h3 { font-size: var(--gr-h3); line-height: 1.2; }
.karte-text p { margin: 6px 0 0; font-size: 17px; color: var(--text2); }
.news-karte .meta { margin: 0 0 6px; font-size: 15px; }
.news-karte .auszug { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.unterzeile { color: var(--text2); }
.seiten { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 48px; font-size: 15px; color: var(--text2); }
.seiten a { display: inline-flex; align-items: center; gap: 4px; }
.seiten svg { width: 16px; height: 16px; }
.artikel { padding: clamp(40px, 5vw, 80px) 0; }
.artikel .wrap { max-width: 1100px; }
.artikel-kopf h1 { font-size: var(--gr-h1); line-height: 1.15; max-width: 24ch; }
.artikel-kopf .meta { color: var(--text2); font-size: 15px; margin: 16px 0 0; }
.artikel-bild { margin: 36px auto; }
.artikel-bild img { border-radius: var(--radius); width: 100%; }
.artikel-text { margin-top: 30px; }
.artikel-text .fliess { max-width: 860px; }
.artikel-text .justiert { margin: 28px 0; }
.schlagworte { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 8px; }
.schlagworte a { font-size: 15px; background: #fff; color: var(--text) !important; padding: 4px 12px; }
.nachbarn { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--linie); }
.nachbarn a { display: block; color: var(--text) !important; font-size: var(--gr-text); line-height: 1.3; }
.nachbarn a small { display: block; font-weight: 400; color: var(--text2); font-size: 13px; margin-bottom: 4px; }
.nachbarn .rechts { text-align: right; }
@media (max-width: 640px) { .nachbarn { grid-template-columns: 1fr; } .nachbarn .rechts { text-align: left; } }

/* Impressum, Datenschutz */
.recht-seite .fliess { max-width: var(--text-breite); }
.recht-seite .fliess h2 { font-size: var(--gr-h3); }
.recht-seite .fliess p, .recht-seite .fliess li { overflow-wrap: anywhere; }

/* ---------- Fuß wie live: Inhaberin und Anschrift · Herz-Logo · Kontakt, mittig gesetzt, Impressum/Datenschutz unterstrichen ---------- */
.fuss { background: var(--grund); color: var(--text); padding: clamp(32px, 4vw, 56px) 0 22px; }
.fuss-raster { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; text-align: center; }
.fuss-spalte { max-width: 340px; justify-self: center; }
.fuss-raster > :first-child { justify-self: start; } .fuss-raster > :last-child { justify-self: end; }
.fuss h2 { font-family: var(--schrift); font-size: var(--gr-text); font-weight: 700; line-height: 1.5; margin: 0 0 1em; }
.fuss a { color: inherit !important; }
.fuss-recht { margin: 1.6em 0 0; }
.fuss-recht a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.fuss-logo img { width: clamp(150px, 15vw, 210px); height: auto; margin: 0 auto; }
.fuss-mitte .knopf-zeile { margin: 14px 0 0; }
.fuss-leiste { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 24px; margin-top: 36px; padding-top: 14px; border-top: 1px solid var(--linie); font-size: 14px; color: var(--text2); }
.fuss-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; }
.geschuetzt { display: inline-flex; align-items: center; gap: 8px; }
.geschuetzt img { width: 76px; height: auto; }
@media (max-width: 860px) { .fuss-raster { grid-template-columns: 1fr; } .fuss-raster > * { justify-self: center !important; } .fuss-mitte { order: -1; } .fuss-leiste { justify-content: center; text-align: center; } }

/* ---------- Lightbox ---------- */
.lb { position: fixed; inset: 0; z-index: 200; background: rgba(0, 0, 0, .96); display: grid; grid-template-rows: auto 1fr auto; color: #f5f5f7; opacity: 0; transition: opacity .25s; touch-action: pan-y pinch-zoom; }
.lb.offen { opacity: 1; }
.lb-kopf { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; font-size: 14px; color: #a1a1a6; }
.lb-flaeche { position: relative; display: grid; place-items: center; overflow: hidden; }
.lb-flaeche img { max-width: 100vw; max-height: calc(100dvh - 110px); width: auto; height: auto; object-fit: contain; user-select: none; -webkit-user-drag: none; transition: opacity .2s; }
.lb button { background: rgba(255, 255, 255, .1); color: #fff; border: 0; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; }
.lb button:hover { background: rgba(255, 255, 255, .2); }
.lb button svg { width: 22px; height: 22px; }
.lb-zurueck, .lb-vor { position: absolute; top: 50%; translate: 0 -50%; }
.lb-zurueck { left: 14px; } .lb-vor { right: 14px; }
.lb-fuss { text-align: center; padding: 10px; font-size: 13px; color: #86868b; min-height: 40px; }
@media (max-width: 700px) { .lb-zurueck, .lb-vor { display: none !important; } }

/* Handy */
@media (max-width: 560px) { .knopf { padding: 16px 26px; } }

/* Abschnitt mit nur einem Foto: Band über die volle Breite, Bildmittelpunkt aus dem Admin (Board 24.10.2026) */
.fotoband { display: block; background: #000; }
.fotoband > a { display: block; cursor: zoom-in; }
.fotoband img { display: block; width: 100%; height: clamp(320px, min(56vw, 86vh), 1300px); object-fit: cover; }
/* Formular in einer Spalte (Kontakt): ohne grauen Kasten, volle Spaltenbreite */
.spalte .formular { background: none; padding: 0; margin: 0; max-width: none; border-radius: 0; }
.spalte .block-bild[style] { margin-inline: 0; }

/* ---------- Lindana (OWL-2290) ---------- */
/* Instagram-Kacheln (Seite „Social“) */
.instagram { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.instagram a { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: #cfd0d1; }
.instagram img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.instagram a:hover img { transform: scale(1.05); }
.instagram .ig-zeichen { position: absolute; right: 10px; top: 10px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: rgba(0, 0, 0, .45); color: #fff; }
.instagram .ig-zeichen svg { width: 17px; height: 17px; }
@media (max-width: 800px) { .instagram { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; } }
/* „Auf dem Laufenden bleiben“ über dem Fuß (live: schmale Spalte, Feld weiß, Knopf schwarz, beides eckig) */
.newsletter .wrap { max-width: calc(560px + 2 * var(--rand)); }
.newsletter h2 { font-size: clamp(28px, calc(22px + 1vw), 37px); margin: 0 0 12px; }
.newsletter .nl-form { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 10px; }
.newsletter .nl-form .meldung { flex-basis: 100%; margin: 0; }
.newsletter .nl-feld { flex: 1 1 240px; display: block; }
.newsletter .nl-feld input { width: 100%; height: 58px; padding: 0 20px; font: inherit; border: 0; border-radius: 0; background: #fff; color: var(--text); }
.newsletter .nl-form .knopf { height: 58px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Umfang / Preis in den Paket-Karten (Shootings & Preise): Linien-Akkordeon wie live */
.spalte .faq { max-width: none; margin: 10px 0 0; }
.spalte .faq summary { padding: 9px 0; font-size: 16px; }
.spalte .faq .fliess { padding: 0 0 12px; font-size: 16px; }

/* noto-color-emoji-[0]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-0-400-normal.woff2) format('woff2');
  unicode-range: U+1f1e6-1f1ff;
}

/* noto-color-emoji-[1]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-1-400-normal.woff2) format('woff2');
  unicode-range: U+200d,U+2620,U+26a7,U+fe0f,U+1f308,U+1f38c,U+1f3c1,U+1f3f3-1f3f4,U+1f6a9,U+e0062-e0063,U+e0065,U+e0067,U+e006c,U+e006e,U+e0073-e0074,U+e0077,U+e007f;
}

/* noto-color-emoji-[2]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-2-400-normal.woff2) format('woff2');
  unicode-range: U+23,U+2a,U+30-39,U+a9,U+ae,U+200d,U+203c,U+2049,U+20e3,U+2122,U+2139,U+2194-2199,U+21a9-21aa,U+23cf,U+23e9-23ef,U+23f8-23fa,U+24c2,U+25aa-25ab,U+25b6,U+25c0,U+25fb-25fe,U+2611,U+2622-2623,U+2626,U+262a,U+262e-262f,U+2638,U+2640,U+2642,U+2648-2653,U+2660,U+2663,U+2665-2666,U+2668,U+267b,U+267e-267f,U+2695,U+269b-269c,U+26a0,U+26a7,U+26aa-26ab,U+26ce,U+26d4,U+2705,U+2714,U+2716,U+271d,U+2721,U+2733-2734,U+2747,U+274c,U+274e,U+2753-2755,U+2757,U+2764,U+2795-2797,U+27a1,U+27b0,U+27bf,U+2934-2935,U+2b05-2b07,U+2b1b-2b1c,U+2b55,U+3030,U+303d,U+3297,U+3299,U+fe0f,U+1f170-1f171,U+1f17e-1f17f,U+1f18e,U+1f191-1f19a,U+1f201-1f202,U+1f21a,U+1f22f,U+1f232-1f23a,U+1f250-1f251,U+1f310,U+1f3a6,U+1f3b5-1f3b6,U+1f3bc,U+1f3e7,U+1f441,U+1f499-1f49c,U+1f49f-1f4a0,U+1f4ac-1f4ad,U+1f4b1-1f4b2,U+1f4b9,U+1f4db,U+1f4f2-1f4f6,U+1f500-1f507,U+1f515,U+1f518-1f524,U+1f52f-1f53d,U+1f549,U+1f54e,U+1f5a4,U+1f5e8,U+1f5ef,U+1f6ab,U+1f6ad-1f6b1,U+1f6b3,U+1f6b7-1f6bc,U+1f6be,U+1f6c2-1f6c5,U+1f6d0-1f6d1,U+1f6d7,U+1f6dc,U+1f7e0-1f7eb,U+1f7f0,U+1f90d-1f90e,U+1f9d1-1f9d2,U+1f9e1,U+1fa75-1fa77,U+1faaf;
}

/* noto-color-emoji-[3]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-3-400-normal.woff2) format('woff2');
  unicode-range: U+200d,U+231a-231b,U+2328,U+23f0-23f3,U+2602,U+260e,U+2692,U+2694,U+2696-2697,U+2699,U+26b0-26b1,U+26cf,U+26d1,U+26d3,U+2702,U+2709,U+270f,U+2712,U+fe0f,U+1f302,U+1f321,U+1f392-1f393,U+1f3a9,U+1f3bd,U+1f3ee,U+1f3f7,U+1f3fa,U+1f451-1f462,U+1f484,U+1f489-1f48a,U+1f48c-1f48e,U+1f4a1,U+1f4a3,U+1f4a5,U+1f4b0,U+1f4b3-1f4b8,U+1f4bb-1f4da,U+1f4dc-1f4f1,U+1f4ff,U+1f508-1f514,U+1f516-1f517,U+1f526-1f529,U+1f52c-1f52e,U+1f550-1f567,U+1f56f-1f570,U+1f576,U+1f587,U+1f58a-1f58d,U+1f5a5,U+1f5a8,U+1f5b1-1f5b2,U+1f5c2-1f5c4,U+1f5d1-1f5d3,U+1f5dc-1f5de,U+1f5e1,U+1f5f3,U+1f6aa,U+1f6ac,U+1f6bd,U+1f6bf,U+1f6c1,U+1f6cb,U+1f6cd-1f6cf,U+1f6d2,U+1f6e0-1f6e1,U+1f6f0,U+1f97b-1f97f,U+1f9af,U+1f9ba,U+1f9e2-1f9e6,U+1f9ea-1f9ec,U+1f9ee-1f9f4,U+1f9f7-1f9ff,U+1fa71-1fa74,U+1fa79-1fa7b,U+1fa86,U+1fa8e-1fa8f,U+1fa91-1fa93,U+1fa96,U+1fa99-1faa0,U+1faa2-1faa7,U+1faaa-1faae;
}

/* noto-color-emoji-[4]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-4-400-normal.woff2) format('woff2');
  unicode-range: U+265f,U+26bd-26be,U+26f3,U+26f8,U+fe0f,U+1f004,U+1f0cf,U+1f380-1f384,U+1f386-1f38b,U+1f38d-1f391,U+1f396-1f397,U+1f399-1f39b,U+1f39e-1f39f,U+1f3a3-1f3a5,U+1f3a7-1f3a9,U+1f3ab-1f3b4,U+1f3b7-1f3bb,U+1f3bd-1f3c0,U+1f3c5-1f3c6,U+1f3c8-1f3c9,U+1f3cf-1f3d3,U+1f3f8-1f3f9,U+1f47e,U+1f4e2,U+1f4f7-1f4fd,U+1f52b,U+1f579,U+1f58c-1f58d,U+1f5bc,U+1f6f7,U+1f6f9,U+1f6fc,U+1f93f,U+1f941,U+1f945,U+1f947-1f94f,U+1f9e7-1f9e9,U+1f9f5-1f9f6,U+1fa70-1fa71,U+1fa80-1fa81,U+1fa83-1fa85,U+1fa87-1fa8a,U+1fa94-1fa95,U+1fa97-1fa98,U+1faa1,U+1faa9,U+1fadf;
}

/* noto-color-emoji-[5]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-5-400-normal.woff2) format('woff2');
  unicode-range: U+2693,U+26e9-26ea,U+26f1-26f2,U+26f4-26f5,U+26fa,U+26fd,U+2708,U+fe0f,U+1f301,U+1f303,U+1f306-1f307,U+1f309,U+1f310,U+1f3a0-1f3a2,U+1f3aa,U+1f3cd-1f3ce,U+1f3d5,U+1f3d7-1f3db,U+1f3df-1f3e6,U+1f3e8-1f3ed,U+1f3ef-1f3f0,U+1f488,U+1f492,U+1f4ba,U+1f54b-1f54d,U+1f5fa-1f5ff,U+1f680-1f6a2,U+1f6a4-1f6a8,U+1f6b2,U+1f6d1,U+1f6d5-1f6d6,U+1f6dd-1f6df,U+1f6e2-1f6e5,U+1f6e9,U+1f6eb-1f6ec,U+1f6f3-1f6f6,U+1f6f8,U+1f6fa-1f6fb,U+1f9bc-1f9bd,U+1f9ed,U+1f9f3,U+1fa7c;
}

/* noto-color-emoji-[6]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-6-400-normal.woff2) format('woff2');
  unicode-range: U+200d,U+2615,U+fe0f,U+1f32d-1f330,U+1f336,U+1f33d,U+1f344-1f37f,U+1f382,U+1f52a,U+1f7e9,U+1f7eb,U+1f942-1f944,U+1f950-1f96f,U+1f99e,U+1f9aa,U+1f9c0-1f9cb,U+1fad0-1fadc;
}

/* noto-color-emoji-[7]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-7-400-normal.woff2) format('woff2');
  unicode-range: U+200d,U+2600-2601,U+2603-2604,U+2614,U+2618,U+26a1,U+26c4-26c5,U+26c8,U+26f0,U+2728,U+2744,U+2b1b,U+2b50,U+fe0f,U+1f300,U+1f304-1f305,U+1f308,U+1f30a-1f30f,U+1f311-1f321,U+1f324-1f32c,U+1f331-1f335,U+1f337-1f33c,U+1f33e-1f344,U+1f3d4,U+1f3d6,U+1f3dc-1f3de,U+1f3f5,U+1f400-1f43f,U+1f490,U+1f4a7,U+1f4ae,U+1f525,U+1f54a,U+1f573,U+1f577-1f578,U+1f648-1f64a,U+1f6d8,U+1f940,U+1f980-1f9ae,U+1f9ba,U+1fa90,U+1faa8,U+1fab0-1fabf,U+1facd-1facf,U+1fae7;
}

/* noto-color-emoji-[8]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-8-400-normal.woff2) format('woff2');
  unicode-range: U+200d,U+2640,U+2642,U+2695-2696,U+26f7,U+26f9,U+2708,U+2764,U+27a1,U+fe0f,U+1f33e,U+1f373,U+1f37c,U+1f384-1f385,U+1f393,U+1f3a4,U+1f3a8,U+1f3c2-1f3c4,U+1f3c7,U+1f3ca-1f3cc,U+1f3eb,U+1f3ed,U+1f3fb-1f3ff,U+1f430,U+1f466-1f469,U+1f46b-1f478,U+1f47c,U+1f481-1f483,U+1f486-1f487,U+1f48b,U+1f48f,U+1f491,U+1f4bb-1f4bc,U+1f527,U+1f52c,U+1f574-1f575,U+1f57a,U+1f645-1f647,U+1f64b,U+1f64d-1f64e,U+1f680,U+1f692,U+1f6a3,U+1f6b4-1f6b6,U+1f6c0,U+1f6cc,U+1f91d,U+1f926,U+1f930-1f931,U+1f934-1f93a,U+1f93c-1f93e,U+1f977,U+1f9af-1f9b3,U+1f9b8-1f9b9,U+1f9bc-1f9bd,U+1f9cc-1f9cf,U+1f9d1-1f9df,U+1fa70,U+1fa82,U+1fac3-1fac5,U+1fac8,U+1faef;
}

/* noto-color-emoji-[9]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-9-400-normal.woff2) format('woff2');
  unicode-range: U+200d,U+2194-2195,U+2603,U+261d,U+2620,U+2639-263a,U+2665,U+26a1,U+26c4,U+270a-270d,U+2728,U+2763-2764,U+2b50,U+fe0f,U+1f31a-1f31f,U+1f32b,U+1f389-1f38a,U+1f3fb-1f3ff,U+1f440-1f450,U+1f463-1f465,U+1f479-1f47b,U+1f47d-1f480,U+1f485,U+1f48b-1f48c,U+1f493-1f49f,U+1f4a2,U+1f4a4-1f4a6,U+1f4a8-1f4ab,U+1f4af,U+1f525,U+1f573,U+1f590,U+1f595-1f596,U+1f5a4,U+1f5e3,U+1f600-1f644,U+1f648-1f64a,U+1f64c,U+1f64f,U+1f90c-1f925,U+1f927-1f92f,U+1f932-1f933,U+1f970-1f976,U+1f978-1f97a,U+1f9a0,U+1f9b4-1f9b7,U+1f9bb,U+1f9be-1f9bf,U+1f9d0,U+1f9e0-1f9e1,U+1fa75-1fa79,U+1fac0-1fac2,U+1fac6,U+1fae0-1fae6,U+1fae8-1faea,U+1faef-1fafa;
}

/* noto-color-emoji-[10]-400-normal */
@font-face {
  font-family: 'Noto Color Emoji';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/fonts/emoji/noto-color-emoji-10-400-normal.woff2) format('woff2');
  unicode-range: U+1f6d9,U+1fa8b-1fa8d,U+1facc,U+1fadd,U+1faeb;
}