/*
Theme Name: rosario
Description: Ristorantino Da Rosario, Königsbrunn — One-Pager
Version: 1.0
*/

/* ------------------------------------------------------------
   Schriften liegen im Theme, nicht bei Google.
   Würden sie von fonts.gstatic.com kommen, ginge bei jedem
   Seitenaufruf ungefragt die IP-Adresse des Besuchers dorthin —
   und dann bräuchte die Seite ein Cookie-Banner.
   ------------------------------------------------------------ */
@font-face{
  font-family:'Bodoni Moda';
  font-style:normal;
  font-weight:400 500;
  font-display:swap;
  src:url('fonts/BodoniModa-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Bodoni Moda';
  font-style:italic;
  font-weight:400 500;
  font-display:swap;
  src:url('fonts/BodoniModa-italic.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Karla';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('fonts/Karla-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  --gruen:#123027;
  --gruen-tief:#0c211b;
  --elfenbein:#f2ece0;
  --elfenbein-2:#cdc6b6;
  --rot:#c8452f;          /* nur als Fläche mit weißer Schrift */
  --rot-text:#e87a63;     /* für Text auf dunklem Grund, Kontrast 5,0:1 */
  --gold:#c9a24a;
  --kante:rgba(242,236,224,.16);
  --kante-stark:rgba(242,236,224,.4);
}

*{box-sizing:border-box}

body{
  margin:0;
  background:var(--gruen);
  color:var(--elfenbein);
  font-family:Karla,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.wrap{max-width:70rem;margin:0 auto;padding:0 1.5rem}

.skip{position:absolute;left:-9999px}
.skip:focus{
  left:1rem;top:1rem;z-index:99;
  background:var(--rot);color:#fff;padding:.6rem 1rem;border-radius:2px;
}

/* ---------- Kopfzeile ---------- */
nav{border-bottom:1px solid var(--kante);position:relative;z-index:5}
.nav-innen{
  display:flex;align-items:center;justify-content:space-between;
  gap:1.5rem;padding-top:1.1rem;padding-bottom:1.1rem;
}
.marke{
  font-family:'Bodoni Moda',Didot,Georgia,serif;
  font-size:1.15rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
}
nav ul{
  display:flex;gap:1.6rem;list-style:none;margin:0;padding:0;
  font-size:.92rem;overflow-x:auto;   /* mobil scrollbar, nie ausgeblendet */
  -webkit-overflow-scrolling:touch;
}
nav ul::-webkit-scrollbar{display:none}
nav li{white-space:nowrap}
nav ul a{text-decoration:none;padding-bottom:.15rem;border-bottom:1px solid transparent}
nav ul a:hover{border-bottom-color:var(--rot-text)}
.nav-tel{
  text-decoration:none;font-weight:700;font-size:.92rem;white-space:nowrap;
  color:var(--elfenbein);border-bottom:1px solid var(--rot);padding-bottom:.1rem;
}
.nav-tel:hover{color:var(--rot-text)}

/* ---------- Kopfbereich ---------- */
.held{padding:5rem 0 4rem;position:relative;overflow:hidden}
.held::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(120% 80% at 15% 0%, rgba(201,162,74,.13), transparent 60%);
}
.held-innen{
  position:relative;display:grid;grid-template-columns:1.15fr .85fr;
  gap:3.5rem;align-items:center;
}
.augenbraue{
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin:0 0 1.4rem;font-weight:700;
}
h1{
  font-family:'Bodoni Moda',Didot,Georgia,serif;font-weight:400;
  font-size:clamp(2.6rem,7vw,5rem);line-height:1.02;letter-spacing:-.015em;
  margin:0 0 1.5rem;text-wrap:balance;
}
h1 em{font-style:italic;color:var(--rot-text)}
.vorsatz{font-size:1.1rem;color:var(--elfenbein-2);max-width:32rem;margin:0 0 2.2rem}
.knoepfe{display:flex;gap:.9rem;flex-wrap:wrap}
.knopf{
  display:inline-block;text-decoration:none;font-weight:700;font-size:.95rem;
  padding:.85rem 1.6rem;border-radius:2px;border:1px solid var(--rot);
  background:var(--rot);color:#fff;letter-spacing:.02em;cursor:pointer;
  font-family:inherit;
}
.knopf:hover{background:#d9573f;border-color:#d9573f}
.knopf.leer{background:transparent;color:var(--elfenbein);border-color:var(--kante-stark)}
.knopf.leer:hover{border-color:var(--elfenbein);background:rgba(242,236,224,.06)}
.held-bild{border:1px solid rgba(201,162,74,.35);padding:.55rem;background:rgba(0,0,0,.2)}

/* ---------- Band ---------- */
.band{background:var(--rot);color:#fff;padding:.85rem 0;font-size:.86rem}
.band .wrap{
  display:flex;gap:2.5rem;justify-content:center;flex-wrap:wrap;
  text-transform:uppercase;font-weight:700;letter-spacing:.05em;
}

/* ---------- Abschnitte ---------- */
section{padding:5rem 0}
.dunkler{background:var(--gruen-tief)}
.zweispalt{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
h2{
  font-family:'Bodoni Moda',Didot,Georgia,serif;font-weight:400;
  font-size:clamp(1.9rem,3.6vw,2.8rem);line-height:1.15;margin:0 0 1.2rem;text-wrap:balance;
}
.linie{width:3rem;height:2px;background:var(--rot);margin:0 0 1.5rem}
p{margin:0 0 1.1rem;color:var(--elfenbein-2)}
p.stark{color:var(--elfenbein)}
.rahmen{border:1px solid rgba(201,162,74,.35);padding:.55rem;background:rgba(0,0,0,.2)}

.karten{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.karte{border:1px solid var(--kante);padding:1.9rem 1.6rem;background:var(--gruen-tief)}
.karte h3{font-family:'Bodoni Moda',Didot,serif;font-weight:500;font-size:1.3rem;margin:0 0 .6rem}
.karte p{margin:0;font-size:.95rem}
.karte .nr{
  font-size:.7rem;letter-spacing:.18em;color:var(--gold);text-transform:uppercase;
  display:block;margin-bottom:.9rem;font-weight:700;
}

/* ---------- Kennzahlen ---------- */
.fakten-block{padding:0}
.fakten{
  display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;text-align:center;
  padding:3.5rem 0;border-top:1px solid var(--kante);border-bottom:1px solid var(--kante);
}
.fakt .zahl{
  font-family:'Bodoni Moda',serif;font-size:2.5rem;line-height:1;
  color:var(--gold);display:block;margin-bottom:.5rem;
}
.fakt .txt{font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;color:var(--elfenbein-2)}

/* ---------- Kontakt ---------- */
.kontakt{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
dl{margin:0}
dt{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);margin-top:1.6rem;font-weight:700;
}
dt:first-of-type{margin-top:0}
dd{margin:.35rem 0 0;font-size:1.05rem}
dd a{text-decoration:none;border-bottom:1px solid var(--rot)}
dd a:hover{color:var(--rot-text)}
.zeiten{display:flex;flex-direction:column;gap:.35rem;margin-top:.2rem}
.zeit-reihe{
  display:flex;justify-content:space-between;gap:1.5rem;
  font-size:.98rem;padding-bottom:.35rem;border-bottom:1px solid var(--kante);
}
.zeit-wert{color:var(--elfenbein);font-weight:700;white-space:nowrap}
.offen-hinweis{color:var(--rot-text);font-size:.98rem}

.formular{border:1px solid rgba(242,236,224,.2);padding:2rem;background:var(--gruen-tief)}
.formular h2{font-size:1.5rem;margin-bottom:1.4rem}
.hinweis-klein{font-size:.88rem;color:var(--elfenbein-2)}

/* Contact Form 7 */
.wpcf7 label{
  display:block;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;
  font-weight:700;color:var(--elfenbein);margin-bottom:.4rem;
}
.wpcf7 p{margin:0 0 1.1rem;color:var(--elfenbein)}
.wpcf7 input[type=text],
.wpcf7 input[type=email],
.wpcf7 input[type=tel],
.wpcf7 textarea{
  width:100%;font:inherit;font-size:.95rem;padding:.7rem;
  background:var(--gruen);border:1px solid var(--kante-stark);
  color:var(--elfenbein);border-radius:2px;margin-top:.25rem;
}
.wpcf7 textarea{min-height:7rem;resize:vertical}
.wpcf7 input:focus-visible,.wpcf7 textarea:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.wpcf7 input[type=submit]{
  font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;
  background:var(--rot);color:#fff;border:1px solid var(--rot);
  padding:.85rem 1.6rem;border-radius:2px;width:auto;
}
.wpcf7 input[type=submit]:hover{background:#d9573f}
.wpcf7-not-valid-tip{color:#ffb4a2;font-size:.85rem}
.wpcf7-response-output{
  border:1px solid var(--kante-stark)!important;padding:.8rem!important;
  margin:1rem 0 0!important;font-size:.9rem;color:var(--elfenbein);
}
.form-datenschutz{font-size:.82rem;color:var(--elfenbein-2);margin:1.2rem 0 0;line-height:1.5}
.form-datenschutz a{color:var(--rot-text)}

/* Spamschutz-Feld: aus dem Blickfeld, aber NICHT display:none —
   manche Bots erkennen display:none und lassen das Feld dann leer. */
.wh-schutz{
  position:absolute!important;left:-9999px!important;top:auto!important;
  width:1px!important;height:1px!important;overflow:hidden!important;
}

/* ---------- Karte ---------- */
.maps-block{padding:0 0 4rem}
.maps-wrap{max-width:70rem;margin:0 auto;padding:0 1.5rem}
.maps-consent{position:relative;overflow:hidden;border:1px solid var(--kante);border-radius:2px}
.maps-vorschau{width:100%;height:300px;object-fit:cover;filter:blur(3px) saturate(.7) brightness(.75)}
.maps-schleier{position:absolute;inset:0;background:rgba(12,33,27,.55)}
.maps-karte-box{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:.7rem;text-align:center;padding:1.5rem;
}
.maps-adresse{margin:0;font-weight:700;color:var(--elfenbein);font-size:1rem}
.maps-btn{
  font:inherit;font-weight:700;font-size:.95rem;cursor:pointer;
  background:var(--rot);color:#fff;border:1px solid var(--rot);
  padding:.75rem 1.5rem;border-radius:2px;
}
.maps-btn:hover{background:#d9573f}
.maps-hinweis{margin:0;font-size:.78rem;color:var(--elfenbein-2);max-width:30rem;line-height:1.5}
.maps-hinweis a{color:var(--rot-text)}
.maps-quelle{
  position:absolute;right:.5rem;bottom:.4rem;font-size:.65rem;
  color:var(--elfenbein-2);background:rgba(12,33,27,.7);padding:.15rem .4rem;border-radius:2px;
}
.maps-wrap iframe{width:100%;height:320px;border:0;display:block}
.maps-route{max-width:70rem;margin:.9rem auto 0;padding:0 1.5rem;font-size:.9rem}
.maps-route a{color:var(--rot-text);text-decoration:none}
.maps-route a:hover{text-decoration:underline}

/* ---------- Fußbereich ---------- */
.address-bar{background:var(--gruen-tief);border-top:1px solid var(--kante);padding:1.1rem 0;font-size:.88rem}
.address-bar .wrap{display:flex;gap:2rem;justify-content:center;flex-wrap:wrap;color:var(--elfenbein-2)}
.address-bar b{color:var(--elfenbein)}
.address-bar a{text-decoration:none}
footer{padding:2.5rem 0;font-size:.85rem;color:var(--elfenbein-2);border-top:1px solid var(--kante)}
footer .wrap{display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.footer-links{display:flex;gap:1.2rem}
.footer-links a{text-decoration:none;border-bottom:1px solid rgba(242,236,224,.3)}
.footer-links a:hover{color:var(--elfenbein)}

/* ---------- Unterseiten (Impressum, Datenschutz) ---------- */
.page-body{max-width:46rem;margin:0 auto;padding:3.5rem 1.5rem 4rem}
.page-title{
  font-family:'Bodoni Moda',Didot,Georgia,serif;font-weight:400;
  font-size:clamp(2rem,5vw,2.8rem);margin:0 0 1.8rem;
}
.page-content{color:var(--elfenbein-2)}
.page-content h2,.page-content h3{
  font-family:'Bodoni Moda',Didot,serif;font-weight:500;color:var(--elfenbein);
  margin:2.2rem 0 .7rem;font-size:1.4rem;
}
.page-content a{color:var(--rot-text)}
.page-content ul{padding-left:1.2rem}
.page-content li{margin-bottom:.4rem}

@media (max-width:52rem){
  .held-innen,.zweispalt,.kontakt{grid-template-columns:1fr;gap:2.5rem}
  .karten,.fakten{grid-template-columns:1fr}
  section{padding:3.5rem 0}
  .held{padding:2.5rem 0 3rem}
  .nav-innen{flex-wrap:wrap;gap:.8rem 1.2rem}
  nav ul{order:3;width:100%;gap:1.2rem}
  .band .wrap{gap:1.2rem;font-size:.78rem}
  .maps-block{padding-bottom:2.5rem}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
