getrankekarte/getraenkekarte.html

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<style>
  @page {
    size: A4 portrait;
    margin: 15mm;
  }
  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }
  body {
    font-family: 'Georgia', serif;
    background-color: #0d1117;
    color: #e6edf3;
    padding: 24px;
    border: 3px double #d4af37;
    border-radius: 8px;
    height: calc(100vh - 30mm);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .header {
    text-align: center;
    border-bottom: 1px solid #d4af37;
    padding-bottom: 12px;
    margin-bottom: 14px;
  }
  .header h1 {
    font-size: 26px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #d4af37;
    margin-bottom: 6px;
  }
  .header p {
    font-size: 13px;
    font-style: italic;
    color: #8b949e;
  }
  .section-title {
    font-size: 15px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #d4af37;
    border-bottom: 1px dashed rgba(212, 175, 55, 0.4);
    padding-bottom: 4px;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 18px;
  }
  .drink {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: 6px;
    padding: 8px 10px;
  }
  .drink-title {
    font-size: 14px;
    font-weight: bold;
    color: #f0e6d2;
    margin-bottom: 4px;
  }
  .drink-desc {
    font-size: 11px;
    line-height: 1.4;
    color: #c9d1d9;
  }
  .drink-desc strong {
    color: #d4af37;
  }
  .mocktails-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
  }
  .footer {
    text-align: center;
    font-size: 11px;
    color: #8b949e;
    border-top: 1px solid rgba(212, 175, 55, 0.3);
    padding-top: 8px;
    margin-top: 10px;
  }
  @media print {
    body {
      background-color: #111 !important;
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
    }
  }
</style>
</head>
<body>

  <div class="header">
    <h1>🍸 GETRÄNKEKARTE 🍸</h1>
    <p>50. Geburtstag — Frisch zubereitet an der Bar auf Eis</p>
  </div>

  <div>
    <div class="section-title">🍹 Cocktail-Highlights</div>
    <div class="grid">
      <div class="drink">
        <div class="drink-title">1. Moscow Mule</div>
        <div class="drink-desc">
          <strong>Zutaten:</strong> Wodka, Limettensaft, Ginger Beer, Minze & Limette.<br>
          <strong>Geschmack:</strong> Scharf-würzig, erfrischend & spritzig.
        </div>
      </div>

      <div class="drink">
        <div class="drink-title">2. Gin & Tonic</div>
        <div class="drink-desc">
          <strong>Zutaten:</strong> Gin, Tonic Water, Limettenscheibe.<br>
          <strong>Geschmack:</strong> Eleganter Klassiker – herb, bitter & rein.
        </div>
      </div>

      <div class="drink">
        <div class="drink-title">3. Mojito</div>
        <div class="drink-desc">
          <strong>Zutaten:</strong> Weißer Rum, frische Minze, Zuckersirup, Limettensaft, Soda.<br>
          <strong>Geschmack:</strong> Aromatisches Bar-Feeling mit frischer Minze.
        </div>
      </div>

      <div class="drink">
        <div class="drink-title">4. Cuba Libre</div>
        <div class="drink-desc">
          <strong>Zutaten:</strong> Weißer Rum, Cola, frischer Limettensaft, Limettenspalte.<br>
          <strong>Geschmack:</strong> Süßer & vertrauter Party-Klassiker.
        </div>
      </div>

      <div class="drink">
        <div class="drink-title">5. Vodka Cranberry</div>
        <div class="drink-desc">
          <strong>Zutaten:</strong> Wodka, Cranberrysaft, Soda, frischer Limettensaft.<br>
          <strong>Geschmack:</strong> Fruchtig-rot, angenehm herb & säuerlich.
        </div>
      </div>

      <div class="drink">
        <div class="drink-title">6. Skinny Bitch</div>
        <div class="drink-desc">
          <strong>Zutaten:</strong> Wodka, Mineralwasser, viel frischer Limettensaft.<br>
          <strong>Geschmack:</strong> Leicht, frisch, zucker- & kalorienfrei.
        </div>
      </div>
    </div>
  </div>

  <div>
    <div class="section-title">🍃 Alkoholfreie Mocktails</div>
    <div class="mocktails-grid">
      <div class="drink">
        <div class="drink-title">Virgin Mojito</div>
        <div class="drink-desc">Frische Minze, Limettensaft, Zuckersirup, Ginger Beer & Sprudel.</div>
      </div>

      <div class="drink">
        <div class="drink-title">Cranberry Ginger Splash</div>
        <div class="drink-desc">Cranberrysaft, frischer Limettensaft & würziges Ginger Beer.</div>
      </div>

      <div class="drink">
        <div class="drink-title">Homemade Lime Soda</div>
        <div class="drink-desc">Frischer Limettensaft, Zuckersirup, aromatische Minze & Eiswasser.</div>
      </div>
    </div>
  </div>

  <div class="footer">
    Cheers! Auf unvergessliche Momente und einen tollen Abend! ✨
  </div>

</body>
</html>