/* Preview only: larger scene and readable supporting text in the existing LK style. */
@media (min-width: 801px) {
  .selected-city { padding-top: 24px; }
  .selected-city h1 { margin-top: 15px; }
  .selected-city .hero-kpis { margin-top: 19px; }
  .selected-city-art {
    width: min(1200px, 100vw);
    height: 370px;
    overflow: hidden;
    margin-top: 24px;
    margin-bottom: 6px;
  }
  .selected-city-art svg { transform: translateY(-58px); }
  .selected-city .selected-intro { margin-top: 18px; font-size: 19px; }
  .selected-city .hero-actions .btn { font-size: 13px; }
}

.selected-city .selected-intro { color: #c2cdd9; }
.selected-city .hero-kpi { font-size: 12px; letter-spacing: .09em; color: #bbc8d5; }
.selected-city .hero-kpi b { font-size: 18px; }
.selected-city .selected-proof .proofline { font-size: 12px; color: #bdcbd9; }
.selected-city-art.selected-city-awaiting .selected-hero-shop { opacity: .72; }
.selected-city-art.selected-city-awaiting .selected-city-label { opacity: .85 !important; }
.selected-city-art svg [data-selected="visible"] {
  font-size: 16px;
  letter-spacing: 2px;
}
.selected-city-art svg [data-selected="shop"] {
  font-size: 17px;
  letter-spacing: 2px;
}
@media (min-width: 801px) {
  .selected-city-art svg [data-selected="visible"] { font-size: 13px; letter-spacing: 1.8px; }
  .selected-city-art svg [data-selected="shop"] { font-size: 14px; letter-spacing: 1.8px; }
}

#leistungen .svc-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#leistungen .svc-tile { min-height: 290px; }
#leistungen .svc-tile h3 { font-size: clamp(21px, 1.9vw, 25px); }
#leistungen .svc-tile p { color: #bdcad7; font-size: 16px; line-height: 1.55; }
#leistungen .svc-more { color: #c4d0dd; font-size: 12px; }
.svc-panel .dt-sum { color: #c4d0dd; font-size: 16px; }
.svc-panel .dt-list li { color: #bdcad7; font-size: 16px; }

.selected-project-section .section-head p { color: #bdcad7; font-size: 17px; }
.selected-project-meta { color: #b8c6d4; font-size: 14px; }
.selected-project-description {
  color: #c0ccd8;
  font-size: 16px;
  line-height: 1.6;
  max-width: 48ch;
}

#preise .section-head p { color: #bdcad7; font-size: 17px; }
#preise .plan-tag { color: #b9c7d6; font-size: 11px; letter-spacing: .11em; }
#preise .plan-desc { color: #c1ccd8; font-size: 16px; line-height: 1.55; }
#preise .plan ul { color: #c1ccd8; font-size: 16px; line-height: 1.5; }
#preise .plan-badge { font-size: 11px; }
#preise .plan .btn { font-size: 12px; }

@media (max-width: 800px) {
  .selected-city .selected-intro { font-size: 16px; }
  .selected-city .hero-kpi { font-size: 10px; }
  .selected-city .hero-kpi b { font-size: 19px; }
  .selected-city .selected-proof .proofline { font-size: 10px; }
  .selected-project-description,
  #preise .plan-desc,
  #preise .plan ul { font-size: 16px; }
  #leistungen .svc-tiles { grid-template-columns: 1fr; }
  #leistungen .svc-tile { min-height: 0; }
  .selected-project-section .section-head p { font-size: 16px; }
  .selected-project-meta { font-size: 14px; }
  #preise .section-head p { font-size: 16px; }
  #preise .plan-tag { font-size: 11px; }
  #preise .plan .btn { font-size: 12px; }
}

@media (max-width: 659px) {
  #leistungen .svc-tiles { gap: 14px; border: 0; }
  #leistungen .svc-tile,
  #leistungen .svc-tile:nth-child(even) {
    display: flex;
    padding: 22px;
    border: 1px solid var(--line-2);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(21,27,37,.55), rgba(11,15,22,.85));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
    overflow: hidden;
  }
  #leistungen .svc-icon { width: 54px; height: 54px; border-radius: 14px; background: radial-gradient(120% 120% at 30% 20%,#1b222c,#0b0e13); }
  #leistungen .svc-icon svg { width: 25px; height: 25px; }
  #leistungen .svc-tile h3 { margin: 19px 0 9px; font-size: 22px; }
  #leistungen .svc-tile p { display: block; font-size: 16px; }
  #leistungen .svc-short { display: none; }
  #leistungen .svc-more { position: relative; inset: auto; display: inline-flex; width: auto; margin-top: auto; padding: 20px 0 0; font-size: 12px; }
  #leistungen .svc-more .arr { display: inline; position: static; width: auto; height: auto; border: 0; background: none; transform: none; font-size: 16px; }
}