/* Korfu Sylbach – eigenes Styling auf Basis von Bootstrap 5.3
   Schriften lokal gehostet (kein Google-Fonts-Abruf, DSGVO-freundlich) */

@font-face{font-family:"GFS Didot";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/gfs-didot-latin-400-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"GFS Didot";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/gfs-didot-greek-400-normal.woff2") format("woff2");
  unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/commissioner-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/commissioner-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Commissioner";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/commissioner-latin-600-normal.woff2") format("woff2")}

:root{
  --k-bg:#f6f7f4;
  --k-surface:#ffffff;
  --k-ink:#13285a;
  --k-ink-soft:#4a5878;
  --k-line:#d9dde3;
  --k-gold:#a8893a;
  --k-sea:#1d4fa0;
  --k-ok:#2f7a4a;
  --k-closed:#a2443b;
  --k-display:"GFS Didot","Didot","Bodoni 72","Times New Roman",serif;
  --k-body:"Commissioner","Segoe UI",system-ui,-apple-system,sans-serif;

  /* Bootstrap-Variablen auf die Hausfarben setzen */
  --bs-body-bg:var(--k-bg);
  --bs-body-color:var(--k-ink);
  --bs-body-font-family:var(--k-body);
  --bs-body-font-size:1.0625rem;
  --bs-body-line-height:1.65;
  --bs-border-color:var(--k-line);
  --bs-link-color-rgb:29,79,160;
  --bs-link-hover-color-rgb:19,40,90;
}

html{scroll-behavior:smooth;scroll-padding-top:5rem}
html,body{overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
h1,h2,h3,.display-face{font-family:var(--k-display);font-weight:400;line-height:1.1;text-wrap:balance}
.eyebrow{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--k-gold);font-weight:600;margin:0 0 .6rem}
.text-soft{color:var(--k-ink-soft)!important}
:focus-visible{outline:2px solid var(--k-gold);outline-offset:3px}

/* Mäanderband */
.meander{height:22px;background:var(--k-gold);opacity:.9;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='22' viewBox='0 0 24 22'%3E%3Cpath d='M0 20.5H24M5 20.5V2.5H20.5V15.5H11V8.5H15.5' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E") repeat-x left center/24px 22px;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='22' viewBox='0 0 24 22'%3E%3Cpath d='M0 20.5H24M5 20.5V2.5H20.5V15.5H11V8.5H15.5' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E") repeat-x left center/24px 22px}

/* Navbar */
.k-nav{background:rgba(246,247,244,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--k-line)}
.k-nav .navbar-brand{font-family:var(--k-display);font-size:1.6rem;color:var(--k-ink);letter-spacing:.02em}
.k-nav .nav-link{color:var(--k-ink-soft);font-size:.95rem}
.k-nav .nav-link:hover{color:var(--k-ink)}
.k-nav .nav-link.k-call{background:var(--k-ink);color:#fff;border-radius:999px;padding:.5rem 1.1rem;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums;transition:background-color .2s,transform .2s,box-shadow .2s}
.k-nav .nav-link.k-call:hover,.k-nav .nav-link.k-call:focus-visible{background:var(--k-sea);color:#fff;transform:translateY(-1px);box-shadow:0 6px 16px rgba(29,79,160,.3)}

/* Status-Badge */
.k-pill{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;font-size:.85rem;white-space:nowrap}
.k-pill::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 22%,transparent)}
.k-pill.is-open{color:var(--k-ok)}
.k-pill.is-closed{color:var(--k-closed)}

/* Hero mit austauschbarem Hintergrundbild */
.k-hero{position:relative;overflow:hidden;color:#fff;background:var(--k-ink);padding-block:clamp(4rem,12vw,8.5rem) clamp(3rem,7vw,5rem)}
.k-slides{position:absolute;inset:0}
.k-slide{position:absolute;inset:0;background:center/cover no-repeat;opacity:0;transition:opacity 1s ease-in-out}
.k-slide.is-active{opacity:1}
.k-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(13,25,55,.88) 0%,rgba(13,25,55,.6) 55%,rgba(13,25,55,.3) 100%)}
.k-hero > .container{position:relative;z-index:2}
.k-hero .eyebrow{color:#e3c879}
.k-hero h1{font-size:clamp(4.5rem,15vw,10rem);line-height:.9;margin:0}
.k-hero h1 small{display:block;font-size:.26em;letter-spacing:.32em;color:#c9d8f3;margin-top:.8rem;line-height:1.2}
.k-hero .lead{color:rgba(255,255,255,.85);max-width:34ch;margin-top:1.4rem}
/* Handy: Überschrift im Header zentriert */
@media (max-width:767.98px){.k-hero-text{text-align:center}.k-hero .lead{margin-inline:auto}.k-hero h1 small{letter-spacing:.2em;margin-right:-.2em}}
.k-status{background:var(--k-surface);color:var(--k-ink);border-radius:14px;padding:1.4rem 1.5rem}
.k-status .k-pill{font-size:.95rem}
.k-status .num{font-family:var(--k-display);font-size:2rem;color:var(--k-ink);text-decoration:none;font-variant-numeric:tabular-nums;line-height:1}

/* Fotos */
.k-photos{padding-block:clamp(2rem,5vw,3rem)}
.k-photo{width:100%;height:auto;border-radius:12px;display:block}

/* Sektionen */
.k-section{padding-block:clamp(3.5rem,8vw,6rem)}
.k-section h2{font-size:clamp(2.4rem,6vw,3.6rem)}
.k-head{max-width:40rem;margin-bottom:2.4rem}

/* Speisekarten-Karten */
.k-menu{display:flex;align-items:center;gap:1.25rem;padding:1.6rem;border:1px solid var(--k-line);border-radius:14px;background:var(--k-surface);text-decoration:none;color:var(--k-ink);height:100%;transition:border-color .2s,transform .2s}
.k-menu:hover{border-color:var(--k-gold);transform:translateY(-2px);color:var(--k-ink)}
.k-menu .ico{flex:none;width:3.2rem;height:4rem;border:1.5px solid var(--k-ink);border-radius:3px;display:grid;place-items:center;font-family:var(--k-display);font-size:1.5rem;color:var(--k-sea);position:relative}
.k-menu .ico::after{content:"";position:absolute;inset:4px;border:1px solid var(--k-line)}
.k-menu h3{font-size:1.65rem;margin:0}
.k-menu p{margin:.25rem 0 0;color:var(--k-ink-soft);font-size:.92rem}
.k-menu .go{margin-left:auto;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--k-gold);white-space:nowrap}
@media (max-width:420px){.k-menu{flex-wrap:wrap}.k-menu .go{margin-left:4.45rem}}
.k-cats{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin:2rem 0 0;padding:0;list-style:none;color:var(--k-ink-soft);font-size:.95rem}
.k-cats li{display:flex;align-items:center;gap:.6rem}
.k-cats li+li::before{content:"";width:5px;height:5px;transform:rotate(45deg);background:var(--k-gold)}

/* Öffnungszeiten */
.k-hours{--bs-table-bg:transparent;font-variant-numeric:tabular-nums;margin:0}
.k-hours th,.k-hours td{padding:.95rem .25rem;border-color:var(--k-line)}
.k-hours th{font-weight:500;width:45%}
.k-hours td{color:var(--k-ink-soft)}
.k-hours tr.is-today th{color:var(--k-sea);font-weight:600}
.k-hours tr.is-today td{color:var(--k-ink)}
.k-hours .badge{background:var(--k-sea);font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:.65rem;vertical-align:2px;margin-left:.5rem}
.k-hours .rest{color:var(--k-closed)}
.k-note{border-left:2px solid var(--k-gold);padding:.2rem 0 .2rem 1.1rem}
.k-note strong{display:block;font-weight:600}
.k-note span{color:var(--k-ink-soft);font-size:.95rem}

/* Kontakt */
.k-contact{background:var(--k-ink);color:#fff}
.k-contact .text-soft{color:rgba(255,255,255,.7)!important}
.k-contact h3{font-family:var(--k-body);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:#e3c879;margin-bottom:.7rem}
.k-contact a{color:#fff;text-underline-offset:4px}
.k-contact .big{font-family:var(--k-display);font-size:clamp(1.8rem,4vw,2.4rem);text-decoration:none;font-variant-numeric:tabular-nums;line-height:1.15}

/* Footer */
.k-footer{padding-block:2rem;font-size:.9rem;color:var(--k-ink-soft)}
.k-footer .btn-link{color:inherit;padding:0;font-size:inherit;text-underline-offset:4px}
.k-footer .btn-link:hover{color:var(--k-ink)}

/* Modals */
.modal-content{border-radius:14px;border:0}
.modal-title{font-family:var(--k-display);font-size:1.9rem}
.legal{font-size:.95rem}
.legal h3{font-family:var(--k-body);font-weight:600;font-size:1.15rem;margin:1.8rem 0 .4rem}
.legal h4{font-family:var(--k-body);font-weight:600;font-size:1rem;margin:1.3rem 0 .3rem}
.legal h5{font-weight:600;font-size:.95rem;margin:1rem 0 .2rem}
.legal > :first-child{margin-top:0}
.legal a{word-break:break-word}
