:root{--bg:#063645;--panel:rgba(255,255,255,.12);--card:#f4f7f8;--text:#f6fbfc;--muted:rgba(246,251,252,.72);--dark:#152329;--soft:#607079;--line:rgba(255,255,255,.18);--accent:#f1d36b;--buttonText:#182025;--radius:28px;--shadow:0 24px 70px rgba(0,0,0,.28);--max:1500px}
body[data-theme=dark]{--bg:#22282e;--accent:#cfd8df}
body[data-theme=green]{--bg:#12372f;--accent:#b7db8a}
body[data-theme=sand]{--bg:#e9dfca;--panel:rgba(255,255,255,.56);--text:#251f16;--muted:rgba(37,31,22,.68);--line:rgba(0,0,0,.16);--accent:#83531f;--buttonText:#fff7ea}
body[data-theme=light]{--bg:#eef2f4;--panel:rgba(255,255,255,.72);--text:#1d2a31;--muted:rgba(29,42,49,.68);--line:rgba(0,0,0,.14);--accent:#235a72;--buttonText:#fff}
*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;background:radial-gradient(circle at 5% 0,rgba(255,255,255,.13),transparent 36rem),var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer}
.topbar{max-width:var(--max);margin:0 auto;padding:22px;display:flex;align-items:center;gap:20px;justify-content:space-between}.logo{display:flex;align-items:center;gap:10px;font-size:28px;font-weight:850;letter-spacing:-.05em}.logo b{display:grid;place-items:center;width:46px;height:36px;border-radius:12px;background:var(--accent);color:#182025;font-size:23px;letter-spacing:-.09em;line-height:1}.themebar{display:flex;gap:7px;padding:7px;border:1px solid var(--line);border-radius:99px;background:var(--panel)}.swatch{width:18px;height:18px;border-radius:99px;border:2px solid rgba(255,255,255,.34);padding:0}.swatch.active{outline:2px solid var(--accent);outline-offset:2px}.blue{background:#063645}.dark{background:#22282e}.green{background:#12372f}.sand{background:#e9dfca}.light{background:#f5f7f8}.topbar nav{display:flex;gap:18px;color:var(--muted);font-weight:650}
main{max-width:var(--max);margin:0 auto;padding:24px 22px 60px}.view{display:none}.view.active{display:block}.hero{display:grid;grid-template-columns:minmax(0,1fr);gap:44px;align-items:center;min-height:70vh}.overline{margin:0 0 12px;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-size:13px;font-weight:850}h1{margin:0;font-size:clamp(42px,6vw,78px);line-height:.96;letter-spacing:-.065em}h2,h3{margin:0;letter-spacing:-.035em}.lead{font-size:clamp(18px,2vw,24px);line-height:1.42;color:var(--muted);max-width:800px}.searchbox{margin-top:32px;display:grid;grid-template-columns:1.15fr .75fr .42fr auto;gap:12px;padding:14px;border-radius:24px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
label{display:grid;gap:8px;color:var(--muted);font-size:13px;font-weight:750}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.93);color:#17232b;padding:13px 14px;outline:0}textarea{resize:vertical}.btn,button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;border:0;border-radius:15px;padding:0 18px;background:var(--accent);color:var(--buttonText);font-weight:900;line-height:1.12;text-align:center}.btn.ghost,.ghostbtn{background:rgba(255,255,255,.09);color:var(--text);border:1px solid var(--line)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.panel,.hero-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);backdrop-filter:blur(16px)}.hero-card{overflow:hidden}.cardbody{padding:20px}.cardbody h2{font-size:30px}.cardbody p{color:var(--muted)}.meta{color:var(--soft);font-weight:800}
.head{margin:24px 0 30px}.head h1{font-size:clamp(38px,5vw,64px)}.head p:last-child{color:var(--muted);font-size:18px}.layout{display:grid;grid-template-columns:285px minmax(0,1fr);gap:24px;align-items:start}.stack{display:grid;gap:16px}.panel{padding:18px}.resultsline{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:16px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.profile-card,.preview-card,.profile-hero,.content-card{background:var(--card);color:var(--dark);border-radius:var(--radius);overflow:hidden;box-shadow:0 16px 48px rgba(0,0,0,.22)}.profile-card h3{font-size:23px}.profile-card p,.preview-card p,.content-card p{color:var(--soft);line-height:1.5}.profile-card .cardbody,.preview-card .cardbody{padding:18px}.tagrow{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.tag{display:inline-flex;padding:6px 9px;border-radius:99px;background:#e8eef1;color:#33434c;font-size:12px;font-weight:750}.cardlink{margin-top:14px;display:flex;justify-content:center;padding:11px;border-radius:14px;background:var(--accent);color:var(--buttonText);font-weight:900;line-height:1.12;text-align:center}
.mosaic{display:grid;width:100%;aspect-ratio:1.72/1;overflow:hidden;background:rgba(255,255,255,.08)}.mosaic.count-1{grid-template-columns:1fr}.mosaic.count-2{grid-template-columns:repeat(2,1fr)}.mosaic.count-3{grid-template-columns:repeat(3,1fr)}.slot{min-width:0;min-height:0;background-size:cover;background-position:center center;border-right:1px solid rgba(255,255,255,.18);display:grid;place-items:center;color:rgba(255,255,255,.82);font-weight:900}.slot:last-child{border-right:0}.slot.empty{border:1px dashed var(--line);background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.03));color:var(--muted)}
.img-ill{background:linear-gradient(135deg,#c7a16d,#37515b 42%,#0e2530)}.img-shoe{background:linear-gradient(135deg,#1d2025,#8c663d)}.img-cafe{background:linear-gradient(135deg,#d69b5c,#39251e)}.img-bike{background:linear-gradient(135deg,#2f3c42,#b7c7cc)}.img-book{background:linear-gradient(135deg,#35291f,#c9a66b)}.img-product{background:linear-gradient(135deg,#322218,#b98452)}.img-project{background:linear-gradient(135deg,#243347,#8aa6cf)}.img-yoga{background:linear-gradient(135deg,#d9e7d4,#567565)}
.builder{display:grid;grid-template-columns:minmax(0,1fr)380px;gap:24px;align-items:start}.hint{margin:0;color:var(--muted);line-height:1.45}.edit{border:2px dashed var(--line);border-radius:var(--radius);margin-top:12px}.edit .slot{border:0;border-right:1px solid var(--line)}.edit .slot.empty{background:rgba(255,255,255,.06)}.imgcontrols{display:grid;gap:12px;margin-top:14px}.imgcontrol{display:grid;gap:10px;padding:14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.07)}.imgcontrol>div{display:flex;gap:8px;flex-wrap:wrap}.imgcontrol .btn,.imgcontrol button{min-height:42px;font-size:14px}.previewbox{position:sticky;top:20px}.previewbox h2{margin-bottom:14px}.profile-cover .mosaic{aspect-ratio:2.05/1}.profile-cover .slot{min-height:360px}.profile-info{padding:30px}.profile-title{display:flex;justify-content:space-between;gap:20px;align-items:start}.profile-title h1{font-size:clamp(38px,5vw,66px);color:var(--dark)}.profile-title p{margin:8px 0 0;color:var(--soft);font-weight:800}.profile-content{margin-top:24px;display:grid;grid-template-columns:minmax(0,1fr)320px;gap:24px}.content-card{padding:24px}.service-list,.contact-list{color:var(--soft);line-height:1.9}.about{max-width:960px}footer{max-width:var(--max);margin:0 auto;padding:22px;color:var(--muted);border-top:1px solid var(--line)}
@media(max-width:930px){.topbar{align-items:flex-start;flex-direction:column}.topbar nav{flex-wrap:wrap}.hero,.layout,.builder,.profile-content{grid-template-columns:1fr}.searchbox{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,1fr)}.previewbox{position:static}}
@media(max-width:620px){main,.topbar{padding-left:14px;padding-right:14px}.grid{grid-template-columns:1fr}.mosaic{aspect-ratio:1.45/1}.profile-cover .mosaic{aspect-ratio:1.45/1}.profile-cover .slot{min-height:260px}h1{font-size:42px}}


/* v0.2.3 – Profilseite: saubere Bündigkeit und konsistente Kontaktliste */
.profile-content > .main-column,
.profile-content > aside {
  align-self: start;
}

.profile-content .content-card:first-child {
  margin-top: 0;
}

.contact-list {
  display: grid;
  gap: 8px;
}


/* v0.2.4 – Galerie auf der Profilseite */
.gallerystrip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.gallerytile {
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  background-size: cover;
  background-position: center;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.2);
}

@media (max-width: 620px) {
  .gallerystrip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* v0.2.5 – Startseite ohne Blindprofil */
.hero {
  max-width: 980px;
  min-height: 66vh;
}

.hero .lead {
  max-width: 760px;
}

.searchbox {
  max-width: 900px;
}

@media(max-width:930px){
  .searchbox{grid-template-columns:1fr}
}


/* v0.2.6 – klare Startnavigation und getrennte Profil-erstellen-Aktion */
.create-teaser {
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  color: var(--muted);
  font-weight: 750;
}

.createbtn {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--accent);
  box-shadow: none;
}

.createbtn:hover {
  background: var(--accent);
  color: #182025;
}

.gallery-upload-demo {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.gallery-add {
  min-height: 92px;
  border: 1px dashed var(--line);
  background: rgba(255,255,255,.07);
  color: var(--muted);
  border-radius: 18px;
}

.manage-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}

@media(max-width:930px){
  .gallery-upload-demo{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .gallery-upload-demo{grid-template-columns:1fr}
}


/* v0.2.7 – Sortierung dezenter, Galerie-Upload klickbar */
.resultsline {
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
}

.sortmini {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
}

.sortmini select {
  width: auto;
  min-width: 150px;
  max-width: 180px;
  padding: 9px 12px;
  border-radius: 12px;
  font-size: 14px;
}

.gallery-add {
  display: grid;
  place-items: center;
  text-align: center;
  cursor: pointer;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  position: relative;
}

.gallery-add.has-image {
  color: white;
  border-style: solid;
}

.gallery-add.has-image::after {
  content: "Bild ersetzen";
  position: absolute;
  inset: auto 8px 8px 8px;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.55);
  font-size: 12px;
  font-weight: 850;
}

.gallery-preview {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px;
}

.gallery-preview .gallerytile {
  aspect-ratio: 1 / 1;
  border-radius: 14px;
}

@media(max-width:620px){
  .resultsline{
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v0.2.8 – Demo-Speicherung */
#saveDemo + #submitDemo {
  margin-left: 8px;
}


/* v0.2.9 – Galerie bis 10 Bilder, zusätzliche Felder einblendbar */
.gallery-hidden {
  display: none;
}

.gallery-more {
  margin-top: 12px;
  width: 100%;
}

.smallhint {
  font-size: 13px;
  margin-top: 10px;
}


/* v0.2.10 – gespeicherte Demo-Profile sichtbar machen */
.saved-profile-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.saved-profile-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid var(--line);
}

.saved-profile-item div {
  display: grid;
  gap: 4px;
}

.saved-profile-item strong {
  color: var(--text);
  font-size: 18px;
}

.saved-profile-item span,
.saved-empty {
  color: var(--muted);
}

.saved-profile-item .btn {
  min-height: 40px;
  white-space: nowrap;
}

@media(max-width:620px){
  .saved-profile-item {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v0.2.13 – Galeriebilder ersetzen UND löschen */
.gallery-tile-wrap {
  position: relative;
  display: grid;
  min-height: 92px;
}

.gallery-tile-wrap.gallery-hidden {
  display: none;
}

.gallery-tile-wrap .gallery-add {
  width: 100%;
  min-height: 92px;
}

.gallery-delete {
  display: none;
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 0;
  background: rgba(0,0,0,.62);
  color: white;
  font-size: 12px;
  font-weight: 850;
}

.gallery-tile-wrap.has-image .gallery-delete {
  display: inline-flex;
}

.gallery-tile-wrap.has-image .gallery-add::after {
  bottom: 50px;
}

.gallery-tile-wrap.has-image .gallery-add {
  color: transparent;
}


/* v0.2.14 – kompaktere Bildbedienung und Bearbeiten-Logik */
.imgcontrol {
  grid-template-columns: 84px minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
  gap: 10px;
}

.imgcontrol > b {
  align-self: center;
}

.imgcontrol > div {
  align-self: end;
}

.compact-select {
  gap: 5px;
}

.compact-select select {
  padding: 10px 12px;
  border-radius: 12px;
}

.imgcontrol .ghostbtn {
  min-width: 110px;
}

.saved-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.profile-info .actions .btn.primary {
  background: var(--accent);
  color: #182025;
}

@media(max-width:930px){
  .imgcontrol {
    grid-template-columns: 1fr;
  }
}


/* v0.2.15 – Schlagworte sauber begrenzen und Bilder vergrößern */
.preview-card .tagrow {
  overflow: hidden;
}

.preview-card .tag,
.content-card .tag,
.profile-card .tag {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tagrow {
  min-width: 0;
}

.clickable-image {
  cursor: zoom-in;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  place-items: center;
  padding: 28px;
  background: rgba(0,0,0,.78);
}

.lightbox.open {
  display: grid;
}

.lightbox-image {
  width: min(92vw, 1200px);
  height: min(82vh, 860px);
  border-radius: 24px;
  background-color: #111;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 30px 90px rgba(0,0,0,.45);
}

.lightbox-close {
  position: fixed;
  top: 18px;
  right: 22px;
  width: 48px;
  height: 48px;
  min-height: 48px;
  border-radius: 999px;
  padding: 0;
  background: rgba(255,255,255,.92);
  color: #101820;
  font-size: 32px;
  line-height: 1;
  z-index: 10000;
}

@media(max-width:620px){
  .lightbox {
    padding: 14px;
  }
  .lightbox-image {
    width: 94vw;
    height: 76vh;
    border-radius: 18px;
  }
}


/* v0.2.18 – mehrere Suchergebnisse mit Seitennavigation */
.pagination {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  color: var(--muted);
  font-weight: 850;
}

.pagination .ghostbtn:disabled {
  opacity: .35;
  cursor: default;
}

@media(max-width:620px){
  .pagination {
    align-items: stretch;
    flex-direction: column;
  }
}


/* v0.2.20 – Rückweg im Profil klar sichtbar */
.profile-info .actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.profile-back {
  background: #e8eef1;
  color: #182025;
  border: 1px solid #cfd9df;
}

.profile-back:hover {
  background: #dce6eb;
  color: #182025;
}

.profile-title .actions {
  justify-content: flex-end;
}

@media(max-width:620px){
  .profile-title .actions {
    justify-content: flex-start;
  }
}


/* v0.2.21 – Rückweg außerhalb des Profils */
.profile-navrow {
  position: sticky;
  top: 10px;
  z-index: 50;
  display: flex;
  justify-content: flex-start;
  margin: 0 0 14px;
  pointer-events: none;
}

.profile-navrow .profile-back {
  pointer-events: auto;
  width: auto;
  min-height: 42px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #182025;
  border: 1px solid rgba(24,32,37,.14);
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
}

.profile-navrow .profile-back:hover {
  background: #ffffff;
  color: #182025;
}

.profile-title .actions:empty {
  display: none;
}


/* v0.2.22 – Rückweg außerhalb der Profilkarte und sichtbarer Weiß-Rand */
.profile-navrow {
  position: sticky;
  top: 86px;
  z-index: 70;
  display: flex;
  justify-content: flex-start;
  margin: 0 0 14px;
  pointer-events: none;
}

.profile-navrow .profile-back {
  pointer-events: auto;
  width: auto;
  min-height: 42px;
  padding: 0 15px;
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  color: #182025;
  border: 1px solid rgba(24,32,37,.18);
  box-shadow: 0 12px 34px rgba(0,0,0,.20);
}

.profile-navrow .profile-back:hover {
  background: #ffffff;
  color: #182025;
}

.swatch.light {
  border-color: rgba(24,32,37,.38);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.65);
}

@media(max-width:620px){
  .profile-navrow {
    top: 72px;
  }
}


/* v0.2.23 – Bearbeiten- und Ansichtsmodus mit gleichen Feldern */
.text-block,
.desc-preview {
  color: var(--soft);
  line-height: 1.55;
  white-space: pre-line;
}

.empty-note {
  color: var(--soft);
  line-height: 1.55;
}

.service-list {
  margin-bottom: 0;
}


/* v0.2.24 – Demo-Profile mit echten Bilddateien */
.profile-card .mosaic { aspect-ratio: 1.72 / 1; background:#dfe7ea; }
.profile-card .slot { background-color:#dfe7ea; }
.profile-card .cardbody { min-height: 255px; display:flex; flex-direction:column; }
.profile-card .cardlink { margin-top:auto; }
.pagination button[disabled] { opacity:.35; cursor:not-allowed; }
.text-block { white-space: pre-line; }
.service-list { margin: 10px 0 0; padding-left: 22px; }
.empty-note { color: var(--soft); }


/* v0.2.25 – Ergebnisliste breiter, Karten realistischer, Logo-Kacheln sauberer */
.layout {
  grid-template-columns: 270px minmax(0, 1fr);
  gap: 32px;
}

.resultsline {
  margin-bottom: 22px;
}

.grid {
  grid-template-columns: repeat(3, minmax(300px, 1fr));
  gap: 22px;
  align-items: stretch;
}

.profile-card {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.profile-card .cardbody {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 20px;
}

.profile-card h3 {
  font-size: 22px;
  line-height: 1.03;
  margin-bottom: 5px;
}

.profile-card p {
  margin: 14px 0 0;
  min-height: 64px;
}

.profile-card .tagrow {
  min-height: 60px;
}

.profile-card .cardlink {
  margin-top: auto;
}

.profile-card .mosaic {
  aspect-ratio: 2.35 / 1;
  background: #dde5e7;
}

.slot.is-logo {
  background-size: contain;
  background-repeat: no-repeat;
  background-color: #f4f1e8;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}

.slot.is-logo:nth-child(2n) { background-color: #efe5d4; }
.slot.is-logo:nth-child(3n) { background-color: #e5ece7; }

.slot.is-portrait {
  background-position: center top !important;
}

@media (min-width: 1250px) {
  main { padding-left: 26px; padding-right: 26px; }
  .profile-card h3 { font-size: 24px; }
}

@media(max-width:1100px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media(max-width:720px){
  .layout{grid-template-columns:1fr;}
  .grid{grid-template-columns:1fr;}
}


/* v0.2.26 – Ergebniskarten ohne sichtbare Schlagworte, keine Logo-Kacheln in der Titelbild-Leiste, bessere Button-Lesbarkeit in hellen Farbwelten */
.profile-card .tagrow {
  display: none;
  min-height: 0;
  margin: 0;
}

.profile-card .cardbody {
  min-height: 190px;
}

.profile-card p {
  min-height: 0;
  margin-bottom: 18px;
}

.cardlink,
.btn,
button {
  color: var(--buttonText);
  font-weight: 900;
  line-height: 1.12;
  text-align: center;
}

.btn.ghost,
.ghostbtn {
  color: var(--text);
}

body[data-theme=light] .cardlink,
body[data-theme=light] .btn:not(.ghost),
body[data-theme=light] button:not(.ghostbtn):not(.swatch),
body[data-theme=sand] .cardlink,
body[data-theme=sand] .btn:not(.ghost),
body[data-theme=sand] button:not(.ghostbtn):not(.swatch) {
  color: var(--buttonText);
}

body[data-theme=light] .logo b,
body[data-theme=sand] .logo b {
  color: var(--buttonText);
}


/* v0.2.27 – Treffer-Vorschau, dunkle CTA-Lesbarkeit und sauberere Button-Kontraste */
.result-preview {
  margin: -4px 0 -2px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
}

#applyFilters {
  width: 100%;
}

body[data-theme=blue] .createbtn,
body[data-theme=dark] .createbtn,
body[data-theme=green] .createbtn {
  color: var(--text);
  border-color: var(--accent);
  background: rgba(255,255,255,.035);
}

body[data-theme=blue] .createbtn:hover,
body[data-theme=dark] .createbtn:hover,
body[data-theme=green] .createbtn:hover {
  color: var(--buttonText);
  background: var(--accent);
}

body[data-theme=blue] .btn.ghost,
body[data-theme=blue] .ghostbtn,
body[data-theme=dark] .btn.ghost,
body[data-theme=dark] .ghostbtn,
body[data-theme=green] .btn.ghost,
body[data-theme=green] .ghostbtn {
  color: var(--text);
}

body[data-theme=blue] .cardlink,
body[data-theme=blue] button:not(.ghostbtn):not(.swatch),
body[data-theme=dark] .cardlink,
body[data-theme=dark] button:not(.ghostbtn):not(.swatch),
body[data-theme=green] .cardlink,
body[data-theme=green] button:not(.ghostbtn):not(.swatch) {
  color: var(--buttonText);
}

body[data-theme=sand] .btn.ghost,
body[data-theme=sand] .ghostbtn,
body[data-theme=light] .btn.ghost,
body[data-theme=light] .ghostbtn {
  color: var(--text);
}

/* v0.2.28 – CTA-Kontrast in hellen Farbwelten korrigiert */
body[data-theme=light] .createbtn,
body[data-theme=sand] .createbtn {
  color: var(--accent) !important;
  border-color: var(--accent);
  background: rgba(255,255,255,.38);
}

body[data-theme=light] .createbtn:hover,
body[data-theme=sand] .createbtn:hover {
  color: var(--buttonText) !important;
  background: var(--accent);
}

body[data-theme=light] .create-teaser,
body[data-theme=sand] .create-teaser {
  color: var(--muted);
}

body[data-theme=light] .create-teaser span,
body[data-theme=sand] .create-teaser span {
  color: var(--muted);
}


/* v0.2.29 – Treffer-Vorschau auch auf der Startseite */
.home-result-preview {
  grid-column: 1 / -1;
  margin: -2px 4px 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
}
#homeSubmit {
  min-width: 132px;
}
@media(max-width:930px){
  .home-result-preview{grid-column:auto}
}


/* v0.2.30 – Home-CTA in hellen Themes klar lesbar */
body[data-theme=light] .create-teaser .createbtn,
body[data-theme=sand] .create-teaser .createbtn {
  font-weight: 900;
  opacity: 1;
}


/* v0.2.31 – einheitliche Button-Logik über alle Farbwelten */
.btn,
button:not(.ghostbtn):not(.swatch),
.cardlink {
  color: var(--buttonText);
}

/* Sekundäre Aktionen: immer Outline, immer Akzentfarbe */
.btn.ghost,
.ghostbtn,
.createbtn {
  background: transparent;
  border: 1px solid var(--accent);
  color: var(--accent) !important;
  box-shadow: none;
}

/* Hover: alle Outline-Buttons werden gefüllt */
.btn.ghost:hover,
.ghostbtn:hover,
.createbtn:hover {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--buttonText) !important;
}

/* Deaktivierte Buttons bleiben erkennbar, aber nicht aktiv wirkend */
.ghostbtn:disabled,
.btn.ghost:disabled {
  opacity: .48;
  cursor: not-allowed;
  color: var(--muted) !important;
  border-color: var(--line);
  background: transparent;
}

/* CTA-Zeile auf der Startseite bleibt in allen Themes gleich lesbar */
.create-teaser span {
  color: var(--muted);
}

.create-teaser .createbtn {
  font-weight: 900;
  opacity: 1;
}


/* v0.2.32 – Profil-Export und strikte Trennung von Titelbildern/Galerie */
.saved-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.import-profile-btn {
  cursor: pointer;
}
.no-gallery {
  margin: 0;
}

/* v0.2.34 – Profilansicht ohne Header-Dopplung und ohne Initialen-Badge */
.searchbox {
  max-width: 1120px;
  grid-template-columns: .82fr 1.15fr .75fr .45fr auto;
}

.helperbtn {
  justify-self: start;
  min-height: 42px;
  margin-top: 4px;
}

.compact-result.profile-card .cardbody {
  min-height: 156px;
}

.compact-result.profile-card h3,
.compact-result.preview-card h3 {
  margin-bottom: 6px;
}

.services-summary {
  color: var(--soft);
  font-weight: 760;
  line-height: 1.45;
}

.profile-card .services-summary {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 12px 0 16px;
}

.preview-card .services-summary {
  margin: 12px 0 10px;
}

.compact-result .desc-preview {
  margin-top: 8px;
}

@media(max-width:930px){
  .searchbox{grid-template-columns:1fr;}
}

/* v0.2.37 – Merken-Button kontrastreicher, Schuster-Bilder differenzierter verteilt */
.is-hidden {
  display: none !important;
}
.auth-notice {
  max-width: 860px;
  margin-bottom: 24px;
}
.account-panel .actions,
.auth-notice .actions {
  margin-top: 18px;
}
.card-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: stretch;
  margin-top: auto;
}
.card-actions .cardlink {
  margin-top: 0;
}
.bookmark-btn {
  background: #eef4f6;
  color: #0d5268 !important;
  border: 1px solid rgba(6, 54, 69, .24);
  font-weight: 850;
}
.bookmark-btn:hover {
  background: #deedf2;
  border-color: #0d5268;
}
.bookmark-btn.small {
  min-height: 42px;
  min-width: 92px;
  padding: 0 14px;
  font-size: 13px;
  border-radius: 14px;
}
.bookmark-btn.active {
  background: #0d5268;
  border-color: #0d5268;
  color: #ffffff !important;
}
.heed-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--buttonText) !important;
}
.bookmark-list .grid,
.bookmark-grid {
  margin-top: 0;
}
.heed-box {
  display: grid;
  gap: 12px;
}
.heed-status {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--soft);
  font-weight: 800;
  line-height: 1.3;
}
.clovers {
  display: inline-flex;
  gap: 3px;
  font-size: 23px;
  letter-spacing: -0.05em;
}
.clover {
  color: #c9d3d8;
}
.clover.filled {
  color: #315f43;
}
.profile-title .actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media(max-width:620px){
  .card-actions {
    grid-template-columns: 1fr;
  }
  .profile-title .actions {
    justify-content: flex-start;
  }
}


/* v0.2.38 – dynamische Ergebniszeile und bessere Seitennavigation */
#searchDemoLine {
  max-width: 980px;
}

.pagination {
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding: 14px 0 0;
}

.pagination-info {
  color: var(--muted);
  font-size: 14px;
  font-weight: 850;
}

.pagination-pages {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.page-btn {
  min-width: 42px;
  padding: 0 12px;
}

.page-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--buttonText) !important;
}

.pagination-ellipsis {
  color: var(--muted);
  font-weight: 900;
  padding: 0 4px;
}

@media(max-width:620px){
  .pagination {
    align-items: stretch;
  }
  .pagination-pages {
    align-items: stretch;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
  .pagination-pages .ghostbtn {
    min-width: 0;
  }
  .pagination-pages .ghostbtn:first-child,
  .pagination-pages .ghostbtn:last-child {
    grid-column: span 3;
  }
}


/* v0.2.39 – Bewertung auf Ergebnis-Karten sichtbar und Merkliste mit Löschen-Aktion */
.card-heed-status {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: -2px 0 14px;
  color: var(--soft);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
}
.card-heed-status .clovers {
  font-size: 18px;
}
.bookmark-grid .bookmark-btn.active {
  background: #f3ece8;
  border-color: #a94a3e;
  color: #8b3027 !important;
}
.bookmark-grid .bookmark-btn.active:hover {
  background: #a94a3e;
  border-color: #a94a3e;
  color: #ffffff !important;
}


/* v0.2.40 – verständlicherer Was-ist-deepheed-Bereich */
.about-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.about-card {
  padding: 22px;
}

.about-card h2 {
  margin: 0 0 10px;
  color: var(--dark);
  font-size: 24px;
}

.about-card p {
  margin: 0;
}

@media(max-width:720px){
  .about-sections {
    grid-template-columns: 1fr;
  }
}


/* v0.2.41 – Werbefreiheit der Suchergebnisse als Prinzip ergänzt */
/* v0.2.42 – Werbe-Grundsatz verbindlicher formuliert */


/* v0.2.44 – Titelbilder in der Bearbeitung direkt ersetzbar */
.edit button.slot {
  width: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  cursor: pointer;
}
.edit button.slot.replaceable-title {
  position: relative;
}
.edit button.slot.replaceable-title::after {
  content: "Bild ersetzen";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.56);
  color: #fff;
  font-size: 12px;
  font-weight: 850;
}


/* v0.2.45 – mobile Vorführ-Demo: kompaktere Karten, aktive Navigation, Rücksprung-/Filterhinweise */
.topbar nav a.active {
  color: var(--text);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 7px;
}
.demo-paths {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 16px;
}
.demo-paths-title {
  width: 100%;
  margin: 0 0 2px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.demo-path {
  min-height: 42px;
  border-radius: 999px;
  padding: 0 14px;
}
.emptysearch .actions {
  margin-top: 14px;
}
@media(max-width:620px){
  main,.topbar{padding-left:10px;padding-right:10px;}
  .topbar nav{gap:10px;font-size:13px;}
  .layout{gap:16px;}
  .grid,
  .bookmark-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px;
  }
  .profile-card .mosaic{
    aspect-ratio:1.36/1;
  }
  .compact-result.profile-card .cardbody,
  .profile-card .cardbody{
    min-height:0;
    padding:10px;
  }
  .compact-result.profile-card h3,
  .profile-card h3{
    font-size:15px;
    line-height:1.08;
    margin-bottom:4px;
  }
  .profile-card .meta{
    font-size:11px;
    line-height:1.2;
  }
  .profile-card .services-summary{
    -webkit-line-clamp:2;
    font-size:11px;
    line-height:1.25;
    margin:6px 0 8px;
  }
  .card-heed-status{
    margin:0 0 7px;
    font-size:10px;
    gap:4px;
  }
  .card-heed-status .clovers{font-size:14px;}
  .card-heed-status span{display:none;}
  .card-actions{
    grid-template-columns:1fr 1fr !important;
    gap:6px;
    margin-top:auto;
  }
  .card-actions .cardlink,
  .bookmark-btn.small{
    min-height:34px;
    padding:0 6px;
    font-size:10.5px;
    border-radius:10px;
  }
  .resultsline{
    align-items:flex-start;
    gap:8px;
  }
  .sortmini{
    font-size:12px;
  }
  .panel{padding:14px;}
}


/* v0.2.46 – Kartenbewertung rechts neben Entfernung, Galerie-Overlay reduziert, Lightbox-Pfeile */
.card-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  margin-bottom: 0;
}
.card-meta-row .meta {
  min-width: 0;
}
.card-meta-row .card-heed-status {
  flex: 0 0 auto;
  margin: 0 0 0 auto;
  justify-content: flex-end;
}
.card-heed-status {
  display: inline-flex;
  align-items: center;
}
.card-heed-status .clovers {
  font-size: 17px;
}
.gallery-add.has-image::after,
.gallery-tile-wrap.has-image .gallery-add::after {
  content: none;
  display: none;
}
.gallery-tile-wrap.has-image .gallery-delete {
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.72);
  color: #fff;
}
.lightbox-nav {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10000;
  width: 54px;
  height: 54px;
  min-height: 54px;
  border-radius: 999px;
  padding: 0;
  background: rgba(255,255,255,.92);
  color: #101820;
  font-size: 42px;
  line-height: 1;
  box-shadow: 0 18px 46px rgba(0,0,0,.28);
}
.lightbox-prev {
  left: 22px;
}
.lightbox-next {
  right: 22px;
}
.lightbox-nav[hidden] {
  display: none !important;
}
@media(max-width:620px){
  .card-meta-row {
    gap: 4px;
  }
  .card-meta-row .card-heed-status {
    margin-left: auto;
  }
  .card-heed-status .clovers {
    font-size: 14px;
  }
  .lightbox-nav {
    width: 42px;
    height: 42px;
    min-height: 42px;
    font-size: 34px;
  }
  .lightbox-prev { left: 10px; }
  .lightbox-next { right: 10px; }
}
.card-heed-status .clovers {
  display: inline-flex;
}
.card-heed-status .clover {
  display: inline-block;
}

/* v0.2.47 – gezielte Korrekturen nach Handy-Test */
.gallery-tile-wrap.has-image .gallery-delete,
.gallery-delete {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.card-heed-status.no-heed .clover {
  opacity: .34;
}
.card-heed-status.has-heed .clover.filled {
  opacity: 1;
}

/* v0.2.48 – gezielte Demo-Fixes: Kleeblätter, Mobile-Suche, Reset, Kartenbuttons */
.clover {
  color: #9aa3a8 !important;
  -webkit-text-fill-color: #9aa3a8 !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}
.clover.filled {
  color: #315f43 !important;
  -webkit-text-fill-color: #315f43 !important;
}
.clover.clickable {
  cursor: pointer;
}
.clover.clickable:hover,
.clover.clickable:focus {
  transform: translateY(-1px);
  outline: none;
}
.heed-btn.active {
  cursor: pointer;
}
.profile-card .services-summary {
  flex: 1 1 auto;
}
.card-actions {
  padding-top: 8px;
  align-items: center;
}
.card-actions .cardlink,
.bookmark-btn.small {
  align-items: center;
  justify-content: center;
}
#applyFilters,
#reset {
  width: 100%;
}
.search-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.search-suggestions[hidden] {
  display: none !important;
}
.suggestion-chip {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.9);
  color: #17232b;
  border: 1px solid rgba(0,0,0,.16);
  font-size: 13px;
  font-weight: 850;
}
.suggestion-chip:hover,
.suggestion-chip:focus {
  background: var(--accent);
  color: var(--buttonText);
}
.gallery-tile-wrap.has-image .gallery-delete,
.gallery-delete {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
@media(max-width:720px){
  input,
  select,
  textarea {
    font-size: 16px;
  }
  #filters {
    gap: 12px;
  }
  #reset {
    display: inline-flex !important;
    min-height: 46px;
    position: relative;
    z-index: 2;
  }
  .search-suggestions {
    gap: 7px;
  }
  .suggestion-chip {
    min-height: 38px;
    font-size: 14px;
  }
}
@media(max-width:620px){
  .card-actions {
    padding-top: 10px;
  }
  .card-actions .cardlink,
  .bookmark-btn.small {
    min-height: 36px;
    line-height: 1.12;
  }
}


/* v0.3 – öffentliche Pilot-Demo: Rechtliches, Pilotstatus, Demo-Kennzeichnung, realistischere Vorschau */
.pilot-note,
.local-save-note {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.12);
  border: 1px solid var(--line);
  color: var(--muted);
  line-height: 1.45;
}
.local-save-note {
  margin: 0 0 8px;
}
.profile-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #17232b;
  background: #e8eef1;
  border: 1px solid rgba(0,0,0,.08);
}
.profile-badge.demo {
  background: #fff1c2;
}
.profile-badge.local {
  background: #dcecff;
}
.profile-badge.pilot {
  background: #dfeee3;
}
.card-job {
  margin: 0 0 6px;
  color: #43525a !important;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
}
.profile-demo-note {
  margin: 12px 0 0;
  color: var(--soft);
  font-weight: 750;
}
.preview-card .card-actions .is-disabled,
.preview-card .card-actions button[disabled] {
  opacity: .78;
  pointer-events: none;
}
.legal-page h1 {
  margin-bottom: 22px;
}
.legal-card h2 {
  margin-top: 24px;
  font-size: 22px;
}
.legal-card h2:first-child {
  margin-top: 0;
}
.legal-card a,
.about-card a,
footer a {
  color: inherit;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}
footer {
  display: grid;
  gap: 10px;
}
.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-weight: 900;
}
.footer-note {
  line-height: 1.45;
}
@media(max-width:620px){
  .profile-badge {
    min-height: 21px;
    padding: 2px 7px;
    margin-bottom: 6px;
    font-size: 9px;
  }
  .card-job {
    font-size: 10.5px;
    margin-bottom: 4px;
  }
  .pilot-note,
  .local-save-note {
    font-size: 14px;
  }
  footer {
    padding-left: 10px;
    padding-right: 10px;
  }
}


/* v0.3.2 – gespeicherte Demo-Profile als echte Profilkarten anzeigen */
.saved-profile-list.saved-profile-cards {
  grid-template-columns: repeat(auto-fit, minmax(255px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.saved-profile-card {
  width: 100%;
}
.saved-profile-card .cardbody {
  min-height: 0;
}
.saved-profile-card .mosaic {
  aspect-ratio: 1.72 / 1;
}
.saved-card-meta {
  margin: 8px 0 0;
  color: var(--soft);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.35;
}
.saved-local-note {
  margin: 4px 0 10px;
  padding: 8px 10px;
  border-radius: 12px;
  background: #e7f0f2;
  color: #52656f !important;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}
.saved-card-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: auto;
  padding-top: 8px;
}
.saved-card-actions .btn,
.saved-card-actions button {
  min-height: 42px;
  padding: 0 10px;
  font-size: 13px;
  line-height: 1.1;
}
@media(max-width:620px){
  .saved-profile-list.saved-profile-cards {
    grid-template-columns: 1fr;
  }
}


/* v0.3.3 – Button-Kontrast in „Profil bearbeiten“ verbessert */
.saved-profile-card .saved-card-actions .btn,
.saved-profile-card .saved-card-actions button {
  background: #f8fbf7;
  border: 1px solid #8fbd5f;
  color: #17352d !important;
  -webkit-text-fill-color: #17352d !important;
  font-weight: 950;
  opacity: 1;
}
.saved-profile-card .saved-card-actions .saved-export-btn {
  background: #e7f4d9;
  border-color: #8fbd5f;
  color: #17352d !important;
  -webkit-text-fill-color: #17352d !important;
}
.saved-profile-card .saved-card-actions .btn:hover,
.saved-profile-card .saved-card-actions button:hover,
.saved-profile-card .saved-card-actions .btn:focus-visible,
.saved-profile-card .saved-card-actions button:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--buttonText) !important;
  -webkit-text-fill-color: var(--buttonText) !important;
}


/* v0.3.4 – Pilot-Klarheit, Stöber-Einstieg, kostenlose Suche ohne Anmeldung */
.browse-entry {
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.pilot-clarity {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.pilot-clarity article {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.09);
  color: var(--text);
}

.pilot-clarity strong,
.pilot-clarity span {
  display: block;
}

.pilot-clarity strong {
  margin-bottom: 6px;
  color: var(--accent);
  font-size: 14px;
  font-weight: 900;
}

.pilot-clarity span {
  color: var(--muted);
  line-height: 1.42;
  font-size: 14px;
}

@media(max-width:930px){
  .pilot-clarity { grid-template-columns: 1fr; }
}


/* v0.3.4 Fix 1 – Pilot-Klarheit sichtbar halten, auch nach Cache-Wechsel */
.pilot-clarity {
  margin-top: 18px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.pilot-clarity article {
  display: block !important;
  padding: 14px !important;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.09) !important;
  color: var(--text) !important;
}
.pilot-clarity strong,
.pilot-clarity span {
  display: block !important;
}
.pilot-clarity strong {
  margin-bottom: 6px !important;
  color: var(--accent) !important;
}
@media(max-width:930px){
  .pilot-clarity { grid-template-columns: 1fr !important; }
}

/* v0.3.4 Fix 2 – Kontaktseite erklärt den Pilot-Profil-Ablauf klarer */
.contact-sections {
  align-items: stretch;
}
.contact-wide-card {
  grid-column: 1 / -1;
}
.contact-wide-card h3 {
  margin-top: 18px;
  margin-bottom: 10px;
  color: var(--dark);
  font-size: 22px;
}
.contact-steps {
  margin: 0 0 16px;
  padding-left: 22px;
  color: var(--soft);
  line-height: 1.55;
}
.contact-steps li {
  margin-bottom: 14px;
}
.contact-steps strong {
  color: var(--dark);
}
@media(max-width:930px){
  .contact-wide-card { grid-column: auto; }
}


/* v0.3.4 fix3 – Profilverwaltung sprachlich klarer, Löschen pro lokaler Karte */
.saved-profile-card .saved-card-actions .saved-delete-btn {
  background: #f8fbf7;
  border-color: #8fbd5f;
  color: #17352d !important;
  -webkit-text-fill-color: #17352d !important;
}
.bookmark-grid .bookmark-btn.small {
  min-width: 0;
  white-space: normal;
}

/* v0.3.4 fix4 – Profil-Anlegen stärker und Demo-Ablauf klarer */
.profile-create-promo {
  margin-top: 22px;
  padding: 20px;
  border: 1px solid rgba(241,211,107,.7);
  border-radius: 24px;
  background: rgba(255,255,255,.13);
  color: var(--text);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  box-shadow: 0 18px 52px rgba(0,0,0,.18);
}
.profile-create-promo strong {
  display: block;
  color: var(--accent);
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.12;
  margin-bottom: 8px;
}
.profile-create-promo p {
  margin: 0 0 8px;
  color: var(--muted);
  line-height: 1.5;
}
.profile-create-promo p:last-child {
  margin-bottom: 0;
}
.profile-create-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 245px;
}
.profile-create-actions .btn {
  width: 100%;
}
.create-demo-explain {
  margin-bottom: 24px;
}
.create-demo-explain h2 {
  margin-bottom: 8px;
}
.create-demo-explain p {
  color: var(--muted);
  line-height: 1.55;
}
.profile-about-card {
  border: 1px solid rgba(241,211,107,.5);
}
.profile-about-card .btn {
  margin-top: 8px;
}
body[data-theme=light] .profile-create-promo,
body[data-theme=sand] .profile-create-promo {
  background: rgba(255,255,255,.86);
  color: var(--dark);
}
body[data-theme=light] .profile-create-promo p,
body[data-theme=sand] .profile-create-promo p {
  color: var(--soft);
}
@media(max-width:930px){
  .profile-create-promo {
    grid-template-columns: 1fr;
  }
  .profile-create-actions {
    min-width: 0;
  }
}


/* v0.3.4 fix5 – Slogan, Starttext und dh-Kürzel */
.hero .lead + .lead { margin-top: -6px; }
.logo b { text-transform: lowercase; }


/* v0.3.5 fix2 – „Einreichen“ als Hauptaktion hervorheben */
.saved-profile-card .saved-card-actions .saved-submit-btn {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--buttonText) !important;
  -webkit-text-fill-color: var(--buttonText) !important;
  box-shadow: 0 10px 22px rgba(40, 74, 45, .16);
}
.saved-profile-card .saved-card-actions .saved-submit-btn:hover,
.saved-profile-card .saved-card-actions .saved-submit-btn:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--buttonText) !important;
  -webkit-text-fill-color: var(--buttonText) !important;
  filter: brightness(.96);
}


/* v0.3.5 fix3/fix4 – eigene deepheed-Dialoge statt Browser-Alert nach dem Einreichen; fix4 behebt Dialog-Aufruf */
.dh-dialog-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(5, 18, 17, .62);
  backdrop-filter: blur(2px);
}
.dh-dialog-card {
  width: min(520px, 100%);
  border-radius: 22px;
  padding: 26px;
  background: #f7fbfb;
  color: #142123;
  border: 1px solid rgba(20,33,35,.12);
  box-shadow: 0 24px 60px rgba(0,0,0,.28);
}
.dh-dialog-title {
  margin-bottom: 12px;
  font-size: 24px;
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: -.04em;
}
.dh-dialog-message p {
  margin: 0 0 10px;
  font-size: 17px;
  line-height: 1.42;
  color: #314447;
}
.dh-dialog-message p:last-child {
  margin-bottom: 0;
}
.dh-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
  flex-wrap: wrap;
}
.dh-dialog-actions .btn {
  min-width: 120px;
}
@media(max-width:560px){
  .dh-dialog-card { padding: 22px; }
  .dh-dialog-actions { flex-direction: column-reverse; }
  .dh-dialog-actions .btn { width: 100%; }
}


/* v0.3.5 fix6 – mobile Klarheit: Formularlabels enger ans Feld, Exportieren aus Profilkarten entfernt */
.builder .stack > .panel > label {
  gap: 4px;
  margin-top: 13px;
}
.builder .stack > .panel > h2 + label,
.builder .stack > .panel > label:first-of-type {
  margin-top: 0;
}
.builder .stack > .panel > p + label {
  margin-top: 14px;
}
.saved-profile-card .saved-card-actions .saved-export-btn {
  display: none !important;
}
@media(max-width:620px){
  .builder .stack > .panel > label {
    gap: 3px;
    margin-top: 15px;
  }
  .builder .stack > .panel > h2 + label,
  .builder .stack > .panel > label:first-of-type {
    margin-top: 0;
  }
  .create-demo-explain p {
    line-height: 1.48;
  }
}

/* v0.3.5 fix8 – Suchbegriff ist wieder echter Inhaltsfilter; Ort/Umkreis allein reichen bei aktivem Suchbegriff nicht. */


/* v0.3.6 pilot2 – pilotrealistische Suche, Vorschau-Sprung, reduzierte Admin-Funktion */
.pilot-search-hint {
  margin-top: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  color: var(--muted);
  line-height: 1.45;
}
.pilot-search-hint strong { color: var(--text); }
.preview-jump-actions { margin-top: 14px; }
.previewbox-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.previewbox-head h2 { margin: 0; }
.preview-return { min-height: 40px; font-size: 13px; padding: 0 12px; }
.admin-tools {
  width: 100%;
  max-width: 360px;
  margin-top: 6px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  color: var(--muted);
}
.admin-tools summary {
  cursor: pointer;
  font-weight: 850;
  color: var(--text);
}
.admin-tools .import-profile-btn { margin-top: 10px; width: 100%; }
.to-top {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 48px;
  height: 48px;
  min-height: 48px;
  padding: 0;
  border-radius: 999px;
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
  z-index: 60;
}
.to-top.visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
@media (max-width: 620px) {
  .builder .stack > .panel > label {
    margin-top: 20px;
  }
  .builder .stack > .panel > label:first-of-type,
  .builder .stack > .panel > h2 + label,
  .builder .stack > .panel > p + label {
    margin-top: 12px;
  }
  .builder label {
    gap: 5px;
  }
  .edit.mosaic {
    aspect-ratio: auto;
  }
  .edit.mosaic.count-2,
  .edit.mosaic.count-3 {
    grid-template-columns: 1fr;
  }
  .edit.mosaic .slot {
    min-height: 230px;
  }
  .edit.mosaic .slot.empty {
    min-height: 72px;
  }
  .previewbox {
    scroll-margin-top: 12px;
  }
  .previewbox-head {
    align-items: stretch;
    flex-direction: column;
  }
  .preview-return {
    width: 100%;
  }
  .to-top {
    right: 14px;
    bottom: 14px;
  }
}


/* v0.3.6 pilot2 – Umkreis allein zählt nicht als Suche; mobile Vorschau schneller erreichbar */
.create-preview-float {
  display: none;
}
@media (max-width: 760px) {
  body[data-view="create"] .create-preview-float {
    display: inline-flex;
    position: fixed;
    left: 14px;
    bottom: 14px;
    z-index: 61;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid var(--accent);
    background: var(--accent);
    color: #0f1c1d;
    font-weight: 900;
    box-shadow: 0 14px 40px rgba(0,0,0,.25);
  }
  body[data-view="create"] .to-top.visible {
    bottom: 72px;
  }
}


/* v0.3.6 pilot3 – Titelbilder im Rahmen manuell verschieben */
.draggable-title {
  position: relative;
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.draggable-title.is-dragging {
  cursor: grabbing;
}
.drag-hint {
  position: absolute;
  left: 12px;
  top: 12px;
  z-index: 2;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.42);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  opacity: 0;
  transform: translateY(-3px);
  transition: opacity .18s ease, transform .18s ease;
  pointer-events: none;
}
.draggable-title:hover .drag-hint,
.draggable-title:focus-within .drag-hint,
.draggable-title.is-dragging .drag-hint {
  opacity: 1;
  transform: translateY(0);
}
.replace-title-btn {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 3;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(0,0,0,.48);
  color: #fff;
  border: 0;
  font-size: 12px;
  font-weight: 900;
}
.imgcontrol .image-reset {
  justify-content: center;
}
@media (max-width: 760px) {
  .drag-hint {
    opacity: 1;
    transform: none;
    font-size: 11px;
    padding: 6px 9px;
  }
  .replace-title-btn {
    min-height: 32px;
  }
}


/* v0.3.6 pilot4 – Abbrechen/Verwerfen im Profilformular */
.builder-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.builder-actions .primary,
.builder-actions .ghostbtn{
  margin:0;
}
#cancelDemo{
  min-width:132px;
}
@media (max-width:700px){
  .builder-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
  }
  .builder-actions .primary,
  .builder-actions .ghostbtn{
    width:100%;
    justify-content:center;
  }
}


/* v0.3.6 pilot7 – klarere Suche, Menü-Pillen, mobile Bildposition nur bewusst bearbeiten */
.searchbox-title,
.filterbox-title{
  grid-column:1/-1;
  color:var(--text);
  font-size:18px;
  font-weight:900;
  letter-spacing:-.03em;
  margin:0 0 2px;
}
.filterbox-title{font-size:16px;margin-bottom:4px;}
.topbar nav{
  gap:8px !important;
  align-items:center;
  flex-wrap:wrap;
}
.topbar nav a{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:var(--muted);
  border:1px solid rgba(255,255,255,.055);
  text-decoration:none !important;
  line-height:1;
  white-space:nowrap;
}
.topbar nav a:hover,
.topbar nav a:focus-visible{
  background:rgba(255,255,255,.11);
  color:var(--text);
  outline:none;
}
.topbar nav a.active{
  background:var(--accent);
  color:var(--buttonText);
  border-color:transparent;
  text-decoration:none !important;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
.draggable-title{
  touch-action:pan-y;
  cursor:default;
}
.draggable-title.position-active{
  touch-action:none;
  cursor:grab;
  outline:2px solid var(--accent);
  outline-offset:-2px;
}
.draggable-title.position-active.is-dragging{cursor:grabbing;}
.draggable-title:not(.position-active) .drag-hint{opacity:.9;transform:none;background:rgba(0,0,0,.28);}
.move-title-btn{
  position:absolute;
  left:12px;
  top:12px;
  z-index:4;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  border:0;
  background:rgba(255,255,255,.86);
  color:#17232b;
  font-size:12px;
  font-weight:900;
}
.move-title-btn + .replace-title-btn{bottom:12px;}
@media(max-width:760px){
  .topbar nav{gap:7px !important;font-size:14px;}
  .topbar nav a{min-height:32px;padding:6px 9px;}
  .edit.mosaic{aspect-ratio:auto;display:grid;grid-template-columns:1fr;gap:10px;border:0;overflow:visible;background:transparent;}
  .edit.mosaic .slot{border:1px dashed var(--line);border-radius:20px;min-height:190px;aspect-ratio:1.65/1;overflow:hidden;}
  .edit.mosaic.count-2,.edit.mosaic.count-3{grid-template-columns:1fr;}
  .move-title-btn{font-size:11px;min-height:30px;padding:0 10px;}
  .replace-title-btn{font-size:11px;min-height:30px;}
  .draggable-title:not(.position-active) .drag-hint{opacity:0;}
}