@charset "UTF-8";
/* ==========================================================================
   STIL „EDEL" — 23.09.2026 abends, Ansage Marcel fuer alle Willkommensseiten
   --------------------------------------------------------------------------
   Vorbild ist Il Gusto (abend.css): dunkle Buehne im Ton des Hauses, darauf
   Glas statt Weiss, EIN Metallton fuer Schrift, Kanten und Zeichen, EIN
   gefuellter Knopf in der Hausfarbe. Aufbau, Abstaende und Bewegung bleiben
   aus style.css; hier werden nur Farben umbelegt.

   ⚠️ Nicht ueberall dieselbe Farbe: jede Karte bringt ihre eigene Palette
   aus clients.php › "palette" mit. index.php prueft jeden Wert (nur #rrggbb)
   und setzt ihn als --e-* am <body>. Diese Datei kennt KEINE Kundenfarbe.
   Paletten und gemessene Kontraste: _STILGUIDE.md › „Farbkonzept edel".

   --e-grund   Buehne (dunkel)          --e-akzent  Metallton (Schrift/Kanten)
   --e-hoch    Glas und Lichtschein     --e-knopf   der eine gefuellte Knopf
   --e-tief    Tiefstes (Kachelgrund)   --e-knopf-schrift  Schrift darauf
   --e-tinte   Schrift auf Glas         --e-leise   Nebenschrift
   --e-oben    Kante oben an der Google-Karte (Rueckfall: Metallton)

   ⚠️ Laedt NUR, wo clients.php › "stil": "edel" steht (body.stil-edel).
   Il Gusto behaelt abend.css unveraendert. Jede Regel haengt am Praefix.
   Bewegung: nur opacity und transform.
   ========================================================================== */

body.stil-edel{
  --e-glas:  color-mix(in srgb, var(--e-hoch) 60%, transparent);
  --e-glas-voll: color-mix(in srgb, var(--e-hoch) 86%, var(--e-grund));
  --e-kante: color-mix(in srgb, var(--e-akzent) 30%, transparent);
  --e-kante-stark: color-mix(in srgb, var(--e-akzent) 55%, transparent);

  /* Haus-Tokens umbelegen (wie Papier-Fassung und Abend): umbelegen, nicht
     neu gestalten. */
  --buehne:      var(--e-grund);
  --buehne-tief: var(--e-tief);
  --buehne-hoch: var(--e-hoch);
  --papier:      var(--e-tinte);
  --papier-hell: var(--e-tinte);
  --silber:      var(--e-leise);
  --stein:       var(--e-leise);
  --stein-tief:  var(--e-leise);
  --tinte:       var(--e-tinte);
  --linie:       var(--e-kante);
  --hell-1: color-mix(in srgb, var(--e-akzent) 8%, transparent);
  --hell-2: color-mix(in srgb, var(--e-akzent) 22%, transparent);
  --hell-3: color-mix(in srgb, var(--e-akzent) 40%, transparent);

  background:var(--e-grund);
  background-image:radial-gradient(120% 60% at 50% 0%, var(--e-hoch) 0%, var(--e-grund) 60%);
  background-attachment:fixed;
  color:var(--e-tinte);
}

/* ---------- Kopf: Schriftzug und Ort im Metallton ---------- */
body.stil-edel .karte__kopf{
  background:transparent;
  border-bottom:1px solid var(--e-kante);
}
body.stil-edel .marke__zug,
body.stil-edel .marke__text,
body.stil-edel .lader__wort,
body.stil-edel .karte__ort{ color:var(--e-akzent); }
body.stil-edel .monogramm{ color:var(--e-akzent);border-color:var(--e-kante-stark); }
/* Wappen mit dunklen Konturen (Trinacria von Mamma Mia) stehen auf einer
   hellen Scheibe im Metallton, sonst verschwinden die Konturen im Grund.
   Nur mit clients.php › "logoScheibe": true; Wortmarken brauchen sie nicht. */
body.stil-edel .logo.logo--scheibe,
body.stil-edel .lader__logo--scheibe{
  background:radial-gradient(circle at 50% 42%, #fffaf0 0%, color-mix(in srgb, var(--e-akzent) 38%, #fffaf0) 100%);
  border-radius:50%;
  padding:10px;box-sizing:border-box;
  width:auto;height:112px;max-height:112px;aspect-ratio:1;
  box-shadow:0 0 0 1px var(--e-kante-stark), 0 14px 30px -14px rgba(0,0,0,.7);
}

/* ---------- Sprachwahl: Glas (die Liste bleibt hell) ---------- */
body.stil-edel .sprachwahl__jetzt{
  background:var(--e-glas);border-color:var(--e-kante);color:var(--e-tinte);
  /* 23.09.2026 spaet: 44 statt 38 px Tippflaeche (_STILGUIDE: nie unter 44).
     Seit 04.10.2026 (Fehlersuche) gilt 44 px auch fuer Il Gusto (abend.css): style.css traegt es. */
  min-height:44px;border-radius:22px;
}
body.stil-edel .sprachwahl__jetzt:hover,
body.stil-edel .sprachwahl[open] .sprachwahl__jetzt{ border-color:var(--e-akzent);color:var(--e-tinte); }
body.stil-edel .sprachwahl__liste{ --tinte:#2b2a28; --linie:#d6d2cb; border-top-color:var(--e-knopf); }
body.stil-edel .sprachwahl__jetzt:focus-visible{ outline-color:var(--e-akzent); }

/* ---------- Google-Karte: Glas, feine Metallkante, Hausfarbe oben ---------- */
body.stil-edel .insel{
  background:var(--e-glas);
  border:1px solid var(--e-kante);
  border-top:2px solid var(--e-oben, var(--e-kante-stark));
  color:var(--e-tinte);
  box-shadow:0 1px 2px rgba(0,0,0,.2), 0 18px 38px -18px rgba(0,0,0,.65);
}
body.stil-edel .unterzeile,
body.stil-edel .dank,
body.stil-edel .danke,
body.stil-edel .danke-ansicht__titel,
body.stil-edel .insel h1,
body.stil-edel .insel-titel{ color:var(--e-tinte); }
body.stil-edel .unterzeile .leise,
body.stil-edel .wertwort,
body.stil-edel .zwischen-text,
body.stil-edel .formular label,
body.stil-edel .bewtext__melde,
body.stil-edel .danke-ansicht__text{ color:var(--e-leise); }
body.stil-edel .weg::before{
  background:linear-gradient(90deg, transparent, var(--e-kante-stark), transparent);
}

/* Sterne: leer als Umriss im Metallton, voll mit dem Gold wie bei Google. */
body.stil-edel .stern .form{ stroke:var(--e-akzent); }
body.stil-edel .stern.voll .form{ stroke:#dd8f0c; }
body.stil-edel .stern:focus-visible{ outline-color:var(--e-akzent); }

/* Felder: hell mit dunkler Schrift, sonst stuende helle Tinte auf Weiss. */
body.stil-edel .formular input,
body.stil-edel .formular textarea{
  color:#1d1b18;background:#fffcf6;border-color:var(--e-kante-stark);
}
body.stil-edel .formular textarea::placeholder{ color:#6b665e; }
body.stil-edel .formular input:focus,
body.stil-edel .formular textarea:focus{ outline-color:var(--e-akzent); }
body.stil-edel .formular__fehler{ color:#f2b8a8; }

/* Der eine gefuellte Knopf: Hausfarbe, feine Metallkante. */
body.stil-edel .knopf-gross,
body.stil-edel .knopf-gross:hover{
  background:var(--e-knopf);color:var(--e-knopf-schrift);
  box-shadow:inset 0 0 0 1px var(--e-kante-stark), 0 10px 26px -10px rgba(0,0,0,.6);
}
@media (hover:hover){ body.stil-edel .knopf-gross:hover{ filter:brightness(1.08); } }
body.stil-edel .knopf-gross:focus-visible{ outline:2px solid var(--e-akzent);outline-offset:2px; }
body.stil-edel .knopf-zweit,
body.stil-edel .knopf-klein,
body.stil-edel .knopf-fein,
body.stil-edel .klein-details.gleich summary{
  background:transparent;color:var(--e-tinte);
  border:1.5px solid var(--e-kante-stark);
}
body.stil-edel .knopf-zweit:hover,
body.stil-edel .knopf-klein:hover,
body.stil-edel .klein-details.gleich summary:hover{ background:var(--hell-1);border-color:var(--e-akzent); }
body.stil-edel .klein-details summary{ color:var(--e-leise); }

/* Google als Textverweis (23.09.2026 abends). */
body.stil-edel .google-link{ color:var(--e-leise);text-decoration-color:var(--e-kante-stark); }
body.stil-edel .google-link:hover{ color:var(--e-tinte);text-decoration-color:var(--e-akzent); }
body.stil-edel .google-link:focus-visible{ outline-color:var(--e-akzent); }
body.stil-edel .google-text--haupt .google-link{ color:var(--e-tinte); }

/* ---------- Speisekarte als Kachel ---------- */
body.stil-edel .kachel{
  background:var(--e-glas);border:0;color:var(--e-tinte);
  box-shadow:0 0 0 1px var(--e-kante-stark), 0 18px 36px -18px rgba(0,0,0,.7);
}
body.stil-edel .kachel--bild{ background:var(--e-tief); }
body.stil-edel .kachel:focus-visible{ outline-color:var(--e-akzent); }
body.stil-edel .kachel--bild::before{
  background:linear-gradient(180deg, transparent 30%, color-mix(in srgb, var(--e-tief) 90%, transparent) 100%);
}
body.stil-edel .kachel__titel{ color:var(--e-tinte);text-shadow:0 1px 14px rgba(0,0,0,.55); }
body.stil-edel .kachel__pfeil{
  border-color:var(--e-kante-stark);
  background:color-mix(in srgb, var(--e-tief) 45%, transparent);
  color:var(--e-akzent);
}
body.stil-edel .kachel__zeichen svg{ stroke:var(--e-akzent); }

/* ---------- Knoepfe zu zweit, Speisekarte-Knopf: Glas ---------- */
body.stil-edel .wege__knopf,
body.stil-edel .knopf-menu{
  background:var(--e-glas);
  border-color:var(--e-kante);
  box-shadow:none;
  color:var(--e-tinte);
  transition:transform .16s var(--kurve), background .22s ease-out, border-color .22s ease-out;
}
@media (hover:hover){
  body.stil-edel .wege__knopf:hover,
  body.stil-edel .knopf-menu:hover{ border-color:var(--e-kante-stark);background:var(--e-glas-voll); }
}
body.stil-edel .wege__knopf:focus-visible{ outline-color:var(--e-akzent); }
body.stil-edel .wege__knopf svg:not(.ikone--marke),
body.stil-edel .knopf-menu svg{ stroke:var(--e-akzent); }
body.stil-edel .wege__logo{ box-shadow:0 0 0 1px var(--e-kante-stark); }
body.stil-edel .wlan__klein{ color:var(--e-leise); }
body.stil-edel .wlan.ist-kopiert{ border-color:var(--e-akzent); }

/* ---------- Linkzeilen (Kontakt, weitere Wege): EINE Glasflaeche ---------- */
body.stil-edel .links{
  background:var(--e-glas);border-color:var(--e-kante);box-shadow:none;
}
body.stil-edel .knopf-neben{ color:var(--e-tinte);border-top-color:var(--e-kante); }
body.stil-edel .knopf-neben:hover{ background:var(--hell-1); }
body.stil-edel .knopf-neben:focus-visible{ outline-color:var(--e-akzent); }
body.stil-edel .knopf-neben svg{ stroke:var(--e-akzent); }
body.stil-edel .zeile-klein{ color:var(--e-leise); }
body.stil-edel .knopf-vcard,
body.stil-edel .knopf-vcard:hover{ background:var(--e-knopf);color:var(--e-knopf-schrift); }
body.stil-edel .knopf-vcard svg{ stroke:var(--e-knopf-schrift); }
body.stil-edel .knopf-vcard .zeile-klein{ color:var(--e-knopf-schrift); }

/* ---------- Andere Laeden, „Was wir ausserdem anbieten" ---------- */
body.stil-edel .schwestern h2,
body.stil-edel .dazu h2{ color:var(--e-akzent); }
body.stil-edel .schwestern__sub{ color:var(--e-leise); }
body.stil-edel .chip,
body.stil-edel .chip--dazu{
  background:var(--e-glas);color:var(--e-tinte);
  border-color:var(--e-kante);border-left-color:var(--e-kante-stark);
  box-shadow:none;
}
body.stil-edel .chip__name{ color:var(--e-tinte); }
body.stil-edel .chip__zeile,
body.stil-edel .chip__adresse,
body.stil-edel .chip .pfeil{ color:var(--e-leise); }
body.stil-edel .standort__wege{
  background:color-mix(in srgb, var(--e-hoch) 40%, transparent);
  border-color:var(--e-kante);border-left-color:var(--e-kante-stark);
}
body.stil-edel .weg-knopf{
  background:transparent;border-color:var(--e-kante-stark);color:var(--e-tinte);
}
body.stil-edel .weg-knopf:hover{ border-color:var(--e-akzent);background:var(--hell-1); }
body.stil-edel .weg-knopf svg{ stroke:var(--e-akzent); }

/* ---------- Newsletter (Roema) ---------- */
body.stil-edel .nl{
  background:var(--e-glas);border-color:var(--e-kante);
  box-shadow:0 18px 38px -18px rgba(0,0,0,.65);
}
body.stil-edel .nl__titel{ color:var(--e-tinte); }
/* 23.09.2026 spaet: Einwilligungs-Haekchen war ein grellweisser 44-px-Block
   (Browser-Kaestchen mit accent-color #fff). Jetzt Glas mit Metallkante:
   Trefferflaeche bleibt 44 x 44 px, sichtbar ist ein 24-px-Kaestchen
   (10 px durchsichtiger Rand, Hintergrund nur im Innenfeld). Angehakt:
   Metallton mit dunklem Haken. Dazu der Eintragen-Knopf als der eine
   gefuellte Knopf in der Hausfarbe statt Weiss. */
body.stil-edel .nl__haken input{
  -webkit-appearance:none;appearance:none;
  width:44px;height:44px;margin:-9px -9px 0 -10px;padding:0;
  border:10px solid transparent;border-radius:15px;
  background:color-mix(in srgb, var(--e-grund) 55%, transparent) padding-box;
  box-shadow:inset 0 0 0 1.5px var(--e-akzent);
  cursor:pointer;
}
body.stil-edel .nl__haken input:checked{
  background:var(--e-akzent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%231c1b18' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px 18px no-repeat padding-box;
}
body.stil-edel .nl__haken input:focus-visible{ outline:2px solid var(--e-akzent);outline-offset:-8px; }
body.stil-edel .nl__haken{ color:var(--e-leise); }
body.stil-edel .nl__knopf{
  background:var(--e-knopf);color:var(--e-knopf-schrift);
  box-shadow:inset 0 0 0 1px var(--e-kante-stark), 0 10px 26px -10px rgba(0,0,0,.6);
}
body.stil-edel .nl__knopf:focus-visible{ outline:2px solid var(--e-akzent);outline-offset:2px; }
body.stil-edel .nl__zeile,
body.stil-edel .nl__ds,
body.stil-edel .nl__ds a{ color:var(--e-leise); }

/* ---------- Fuss ---------- */
body.stil-edel .fusszeile{ border-top-color:var(--e-kante);color:var(--e-leise); }
body.stil-edel .fusszeile a{ color:var(--e-leise); }

@media (prefers-reduced-motion: reduce){
  body.stil-edel .wege__knopf,
  body.stil-edel .knopf-menu{ transition:none; }
}