:root {
  --bg:   #deecfb;   /* sehr helles Blau */
  --text: #0f172a;   /* sehr dunkles Blau/Grau */

  --btn-1: #368ce7;  /* Hauptbutton */
  --btn-2: #1666ba;  /* dunkler Button / Hover */
  --btn-3: #90caf9;  /* heller Akzent */
}


*
{box-sizing:border-box}
html,body
{
    margin:0;
    padding:0;
    background:var(--bg);
    color:var(--text);
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif

}
.container
{
    max-width:1100px;
    margin:0 auto;
    padding:40px 24px
  }
.container_us{
  max-width:1100px;
  margin:0 auto;
  padding:40px 24px;
  border: 9px solid var(--btn-3);
  border-radius: 20px;   /* optional, gleiche Rundung wie Buttons */
  background: #ffffff80; /* leicht weißer Hintergrund, optional */
}
h1.logo
{
  font-family: 'Dancing Script', cursive;
    font-size:84px;
    margin:40px 0;
    text-align:center}

h1.us
{
  font-family: 'Dancing Script', bold;
    font-size:96px;
    margin:40px 0;
    color: var(--btn-2);
    text-align: center;
}

.back-btn {
  background: var(--btn-1);   /* Gelb */
  padding: 6px 14px;          /* kleiner als normale Buttons */
  border-radius: 9999px;
  font-size: 14px;
  color: #0E0E0E;
}

.grid
{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:24px;
    justify-items:center;
    margin-top:40px
}
.btn
{
    display:inline-block;
    border:none;
    padding:18px 28px;
    border-radius:40px;
    font-size:22px;
    cursor:pointer;
    color:#fff;
    text-decoration:none;
    box-shadow:0 4px 10px rgba(0,0,0,.08);
    transition:transform .06s ease, filter .2s ease;
    width: 200px;      /* feste Breite für alle */
    height: 70px;      /* feste Höhe für alle */
    text-align: center; /* zentriert den Text im Button */
    vertical-align: middle; /* sorgt für vertikale Ausrichtung */
    overflow: hidden;  /* verhindert überlaufenden Text */
    white-space: nowrap; /* Text in einer Zeile, kein Umbruch */
}
.btn:hover
{
    transform:translateY(-1px);
    filter:brightness(1.05)
}


.btn.v1  { background: var(--btn-1); }   
.btn.v11 { background: var(--btn-2); }   
.btn.v12 { background: var(--btn-3); }   

.address
{
    margin-top:40px;
    text-align:center;
    color:#222
}
.survey
{
    margin:24px 0;
    text-align:center
}
.survey a
{
    color:#74c8e7;
    text-decoration:none
}
.navigation {
  margin-top: 40px;   /* Navigation weiter runter */
}
.navigation ul {
  display: flex;
  list-style: none;
  padding: 0;
  gap: 18px;
  justify-content: center;
  margin: 0 0 36px 0;
}

.navigation li {
  font-size: 20px;
}

.navigation a,
.navigation .current {
  text-decoration: none;
  color: #0E0E0E;
  padding: 10px 26px;
  border-radius: 40px;
  transition: background 0.18s;
}

.navigation .current {
  color:black;
  font-weight: bold;
  cursor: default;
  border: 2px solid black; /* style, width und Farbe komplett */
  padding: 8px 20px;
  border-radius: 20px; /* optional, für abgerundete Ecken */
}

.navigation a:hover {
  background: var(--btn-1);
}