:root{
    --nacht:#0B0A08;      /* Schwarz */
    --nacht-2:#161310;
    --tanne:#1C1710;      /* dunkle Flaeche */
    --rot:#C9964F;        /* Gold */
    --rot-dunkel:#B08240;
    --amber:#E4B96E;      /* Gold hell */
    --schnee:#14110C;     /* Seitenhintergrund */
    --karte:#1E1A14;
    --ink:#F0E9DC;
    --muted:#A79E8F;
    --radius:14px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
    color:var(--ink);
    background:var(--schnee);
    line-height:1.6;
    font-size:16px;
  }
  h1,h2,h3{font-family:"Playfair Display",Georgia,serif;line-height:1.15;font-weight:650}
  a{color:var(--rot)}
  img{max-width:100%;display:block}
  .wrap{max-width:1080px;margin:0 auto;padding:0 20px}
  .eyebrow{
    font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
    font-weight:700;color:var(--amber)
  }
  section{padding:64px 0}
  .todo{border-bottom:2px dashed var(--rot);cursor:help}

  /* ---------- Hero ---------- */
  .hero{
    background:linear-gradient(180deg,var(--nacht) 0%,var(--nacht-2) 78%,var(--schnee) 78.2%);
    color:#F4EFE6;
    padding:0 0 96px;
    position:relative;
  }
  .lichterkette{width:100%;height:88px;display:block}
  .bulb{fill:var(--amber);opacity:.55}
  @media (prefers-reduced-motion:no-preference){
    .bulb{animation:gluehen 2.6s ease-in-out infinite}
    .bulb:nth-child(3n){animation-delay:.9s}
    .bulb:nth-child(3n+1){animation-delay:1.7s}
  }
  @keyframes gluehen{0%,100%{opacity:.45}50%{opacity:1}}
  .hero-inner{padding-top:28px}
  .hero h1{
    font-size:clamp(2.1rem,5.4vw,3.6rem);
    font-weight:800;max-width:16ch;margin:14px 0 18px;
    color:#FCF8F0;
  }
  .hero p.sub{max-width:52ch;font-size:1.06rem;color:#D8D2C6;margin-bottom:28px}
  .cta-zeile{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
  .btn{
    display:inline-block;padding:14px 26px;border-radius:999px;
    font-weight:700;text-decoration:none;font-size:1rem;
    transition:transform .12s ease,background .12s ease;
  }
  .btn:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
  .btn-rot{background:var(--rot);color:#1A1408}
  .btn-rot:hover{background:var(--rot-dunkel);transform:translateY(-1px)}
  .btn-ghost{border:1.5px solid #57667A;color:#EDE7DB}
  .btn-ghost:hover{border-color:var(--amber);color:var(--amber)}
  .knapp{
    margin-top:30px;display:inline-flex;gap:10px;align-items:center;
    background:rgba(228,185,110,.12);border:1px solid rgba(228,185,110,.45);
    color:var(--amber);padding:10px 16px;border-radius:10px;font-size:.92rem;font-weight:500;
  }

  /* ---------- Ablauf ---------- */
  .ablauf{padding-top:8px}
  .ablauf h2,.pakete h2,.galerie h2,.anfrage h2{font-size:clamp(1.5rem,3vw,2.1rem);margin-bottom:8px}
  .ablauf .intro,.pakete .intro{color:var(--muted);max-width:60ch;margin-bottom:34px}
  .schritte{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .schritt{
    background:var(--karte);border-radius:var(--radius);padding:22px;
    border:1px solid #2A251D;
  }
  .schritt b{display:block;font-size:1.02rem;margin-bottom:6px}
  .schritt .nr{
    font-family:"Playfair Display",serif;font-weight:800;color:var(--rot);
    font-size:1.5rem;display:block;margin-bottom:8px;
  }
  .schritt p{font-size:.94rem;color:var(--muted)}

  /* ---------- Pakete ---------- */
  .pakete{background:var(--schnee)}
  .paket-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;align-items:stretch}
  .paket{
    background:var(--karte);border-radius:var(--radius);
    border:1px solid #2A251D;display:flex;flex-direction:column;
    overflow:hidden;
  }
  .paket-kopf{padding:22px 22px 14px;border-bottom:1px solid #2A251D}
  .paket-kopf .tag{
    font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--amber);
  }
  .paket-kopf h3{font-size:1.35rem;margin-top:6px}
  .paket-body{padding:18px 22px;flex:1}
  .paket-body ul{list-style:none}
  .paket-body li{
    padding:7px 0;font-size:.95rem;display:flex;gap:9px;align-items:flex-start;
  }
  .paket-body li::before{content:"✔";color:var(--amber);font-weight:700;flex:none}
  .einmal{
    display:inline-block;margin-left:6px;font-size:.68rem;font-weight:700;
    background:var(--nacht);color:var(--amber);border-radius:6px;padding:2px 7px;
    letter-spacing:.06em;vertical-align:middle;white-space:nowrap;
  }
  .paket-fuss{padding:0 22px 22px}
  .preis{
    font-family:"Playfair Display",serif;font-weight:800;font-size:1.5rem;margin:6px 0 14px;
  }
  .preis small{font-family:"DM Sans";font-weight:500;font-size:.8rem;color:var(--muted)}
  .btn-paket{width:100%;text-align:center;background:var(--rot);color:#fff;border:none;cursor:pointer;font-family:inherit}
  .btn-paket:hover{background:var(--rot-dunkel)}
  .hinweis-box{
    margin-top:30px;background:var(--nacht);color:#E9E3D7;
    border-radius:var(--radius);padding:24px 26px;
    display:flex;gap:16px;align-items:flex-start;
  }
  .hinweis-box svg{flex:none;margin-top:3px}
  .hinweis-box b{color:var(--amber)}
  .hinweis-box p{font-size:.95rem}
  .addons{margin-top:30px}
  .addons h3{font-size:1.05rem;margin-bottom:12px}
  .addon-liste{display:flex;flex-wrap:wrap;gap:10px}
  .addon{
    background:var(--karte);border:1px solid #2A251D;border-radius:999px;
    padding:8px 16px;font-size:.9rem;
  }

  /* ---------- Galerie-Platzhalter ---------- */
  .galerie .foto-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
  .galerie figure{
    aspect-ratio:4/3;border:2px dashed #C9C1B0;border-radius:var(--radius);
    display:flex;align-items:center;justify-content:center;text-align:center;
    color:var(--muted);font-size:.9rem;padding:14px;background:#FBF8F2;
  }

  /* ---------- Anfrage ---------- */
  .anfrage{background:var(--tanne);color:#F0EDE4}
  .anfrage .intro{color:#CFC4B0;max-width:58ch;margin-bottom:30px}
  form{
    background:var(--karte);color:var(--ink);border-radius:var(--radius);
    padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:18px;
    max-width:760px;
  }
  .feld{display:flex;flex-direction:column;gap:6px}
  .feld.voll{grid-column:1/-1}
  label{font-size:.85rem;font-weight:700}
  input,select,textarea{
    font-family:inherit;font-size:.98rem;padding:11px 12px;
    border:1.5px solid #3A342B;border-radius:9px;background:#26211A;color:var(--ink);
  }
  input:focus-visible,select:focus-visible,textarea:focus-visible{
    outline:3px solid var(--amber);outline-offset:1px;border-color:var(--amber);
  }
  textarea{min-height:96px;resize:vertical}
  .form-fuss{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
  .form-fuss small{color:var(--muted);max-width:34ch}
  .anfrage .telefon{margin-top:22px;font-size:.98rem;color:#CFC4B0}

  /* ---------- Footer ---------- */
  footer{background:var(--nacht);color:#9AA5B3;padding:34px 0;font-size:.88rem}
  footer .wrap{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center}
  footer a{color:#C9D2DD;text-decoration:none;margin-left:18px}
  footer a:hover{color:var(--amber)}

  /* ---------- Responsive ---------- */
  @media (max-width:820px){
    .schritte,.paket-grid,.galerie .foto-grid{grid-template-columns:1fr}
    form{grid-template-columns:1fr}
    section{padding:48px 0}
  }

  /* CSP-feste Ersatzklassen */
  .einzeln-hinweis{margin-top:14px;font-size:.92rem}
  .einmal--intro{margin-left:0}
  .galerie .foto-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);display:block}

  .zurueck{display:inline-block;margin-bottom:14px;color:#C9A227;text-decoration:none;font-size:.9rem}
  .zurueck:hover{color:#e8c766;text-decoration:underline}