:root{
    --navy:#1b2f45;
    --navy-deep:#122133;
    --sand:#f6f1e8;
    --brick:#a23b2a;
    --ink:#1f2933;
    --muted:#5f6b76;
    --line:#e3dccd;
    /* Farben der Marktstände: pro Angebot anpassbar */
    --s1:#1f4e79;   /* Kundenbewertung.online */
    --s2:#a23b2a;   /* RP-Datentechnik */
    --s3:#3b7d4f;   /* Minigolf-Punkte.de */
    --bs-body-font-family:'Lato',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
    --bs-body-color:var(--ink);
  }
  
  @font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/Lato/Lato-Light.ttf');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Lato/Lato-Regular.ttf');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/Lato/Lato-Bold.ttf');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/Lato/Lato-LightItalic.ttf');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/Lato/Lato-Italic.ttf');
}

@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/Lato/Lato-BoldItalic.ttf');
}
  
  html{scroll-behavior:smooth;scroll-padding-top:70px}
  body{font-size:1rem;line-height:1.7}
  h1,h2,h3{font-weight:900;letter-spacing:-.02em;line-height:1.12;color:var(--navy)}
  h1{font-size:clamp(2rem,4.2vw,3rem)}
  h2{font-size:clamp(1.45rem,2.5vw,1.9rem)}
  h3{font-size:1.2rem;letter-spacing:-.01em}
  a{color:var(--navy)}
  :focus-visible{outline:3px solid var(--brick);outline-offset:3px}
  .eyebrow{font-weight:700;text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--brick)}
  .muted{color:var(--muted)}

  /* Markisen-Streifen: Erkennungszeichen */
  .awning{--c:var(--navy);height:34px;position:relative;
    background:repeating-linear-gradient(90deg,var(--c) 0 28px,#fff 28px 56px)}
  .awning::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;
    background:
      radial-gradient(circle at 14px 0,var(--c) 13.5px,transparent 14.5px) 0 0/56px 14px repeat-x,
      radial-gradient(circle at 14px 0,#fff 13.5px,transparent 14.5px) 28px 0/56px 14px repeat-x}
  .awning.sand{--c:var(--brick)}
  .awning.sand{background:repeating-linear-gradient(90deg,var(--c) 0 28px,var(--sand) 28px 56px)}
  .awning.sand::after{
    background:
      radial-gradient(circle at 14px 0,var(--c) 13.5px,transparent 14.5px) 0 0/56px 14px repeat-x,
      radial-gradient(circle at 14px 0,var(--sand) 13.5px,transparent 14.5px) 28px 0/56px 14px repeat-x}

  /* Kopf */
  .navbar{background:#fff;border-bottom:1px solid var(--line);padding:.7rem 0}
  .navbar-brand{font-weight:900;font-size:1.25rem;letter-spacing:.06em;text-transform:uppercase;color:var(--navy)}
  .navbar-brand span{color:var(--brick)}
  .nav-link{color:var(--ink);font-weight:700;font-size:.92rem}
  .nav-link:hover{color:var(--brick)}
  .btn-navy{background:var(--navy);color:#fff;border:2px solid var(--navy);font-weight:700;border-radius:3px;padding:.75rem 1.6rem}
  .btn-navy:hover{background:var(--navy-deep);border-color:var(--navy-deep);color:#fff}
  .btn-line{border:2px solid var(--navy);color:var(--navy);font-weight:700;border-radius:3px;padding:.75rem 1.6rem}
  .btn-line:hover{background:var(--navy);color:#fff}

  /* Hero */
  .hero{background:var(--sand);padding:4.5rem 0 4rem}
  .hero .lead{font-weight:300;font-size:1.2rem;color:var(--muted);max-width:32em}
  .stall-links{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.75rem}
  .stall-links a{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-weight:700;font-size:.9rem;background:#fff;border:1px solid var(--line);padding:.4rem .9rem;border-radius:999px;color:var(--ink)}
  .stall-links a::before{content:"";width:.7rem;height:.7rem;border-radius:50%;background:var(--c)}
  .stall-links a:hover{border-color:var(--c)}

  section.block{padding:4rem 0}

  /* Marktstände */
  .stall{--c:var(--navy);display:flex;flex-direction:column;height:100%;margin-top:0}
  .stall.s1{--c:var(--s1)}
  .stall.s2{--c:var(--s2)}
  .stall.s3{--c:var(--s3)}
  .stall .awning{--c:var(--c)}
  .stall .body{background:#fff;border:1px solid var(--line);padding:2.25rem 1.5rem 1.6rem;flex:1;display:flex;flex-direction:column}
  .shot{background:repeating-linear-gradient(135deg,rgba(27,47,69,.05) 0 12px,transparent 12px 24px),#e9e4d8;
        color:var(--muted);display:flex;align-items:flex-end;padding:.8rem;font-size:.76rem;font-weight:700;min-height:170px;margin-bottom:1.25rem;border-bottom:3px solid var(--c)}
  .stall h3{margin-bottom:.15rem}
  .stall .url{font-size:.85rem;color:var(--c);font-weight:700;letter-spacing:.02em}
  .stall p{margin:.8rem 0 1rem;color:var(--muted)}
  .tags{list-style:none;padding:0;margin:0 0 1.25rem;display:flex;flex-wrap:wrap;gap:.4rem}
  .tags li{font-size:.78rem;font-weight:700;padding:.1rem .65rem;border:1px solid var(--line);border-radius:999px;color:var(--ink)}
  .btn-stall{margin-top:auto;background:var(--c);color:#fff;border:2px solid var(--c);font-weight:700;border-radius:3px;padding:.7rem 1.3rem;text-align:center;text-decoration:none;display:block}
  .btn-stall:hover{filter:brightness(.88);color:#fff}
  .btn-stall::after{content:" \2197"}

  /* Über uns */
  .about{background:var(--navy);color:#d5dde6}
  .about h2{color:#fff}
  .about .eyebrow{color:#f0b3a8}
  .about .val{border-top:3px solid var(--brick);padding-top:1rem;height:100%}
  .about .val h3{color:#fff;font-size:1.05rem;margin-bottom:.25rem}
  .about .val p{margin:0;font-size:.95rem}

  /* Kontakt */
  .contact dt{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brick);margin-top:1.1rem;font-weight:700}
  .contact dd{margin:0}
  .contact .box{background:var(--sand);padding:2rem;border-top:6px solid var(--brick)}

  footer.site{background:var(--navy-deep);color:#9db0c3;font-size:.88rem;padding:1.5rem 0}
  footer.site a{color:#dbe5ef;text-decoration:none}
  footer.site a:hover{text-decoration:underline}

  @media (max-width:991.98px){
    .hero{padding:3rem 0 2.75rem}
    section.block{padding:2.75rem 0}
  }
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}