/* Startseite: Titelszene, großes Logo, Spruch, „Bescheid zum Release“ */
.start{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden;background:#0b0906 var(--hg) var(--hg-pos,center 62%)/cover no-repeat}
.start::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(10,8,5,.5),rgba(10,8,5,.12) 26%,rgba(10,8,5,0) 42%,rgba(10,8,5,.1) 62%,rgba(10,8,5,.66))}
.start::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.38) 100%)}
.start-kopf{position:relative;z-index:1;gap:48px;padding:48px 40px 0}
.start-kopf nav{flex-direction:column;gap:14px}
.start-kopf .nl{align-items:flex-end}
.start-kopf .nr{align-items:flex-start}
.start-kopf .navi{justify-content:space-between;gap:14px;width:262px;max-width:100%;min-height:54px;padding:10px 16px;font-size:22px;box-shadow:inset 0 1px 0 rgba(255,235,180,.2),inset 0 0 0 1px rgba(0,0,0,.7),0 0 0 1px rgba(0,0,0,.85),0 8px 18px rgba(0,0,0,.45)}
.start-kopf .navi::before,.start-kopf .navi::after{width:6px;height:6px}
.start-kopf h1{margin:0}
.mitte{text-align:center}
.start .logo .l1{font-size:108px;filter:drop-shadow(0 3px 0 #3a2208) drop-shadow(0 0 14px rgba(0,0,0,.85));letter-spacing:.01em}
.start .logo .l2{margin-top:12px;font-size:30px;text-shadow:0 2px 2px #000,0 0 12px rgba(80,160,40,.55)}
.claim{margin-top:24px;font:900 44px/1 var(--f-display);color:#fff4c0;text-shadow:0 3px 0 #3a2208,0 0 18px rgba(0,0,0,.95),0 0 4px #000}
.claim2{margin-top:10px;font:800 15px/1.2 var(--f-ui);letter-spacing:.2em;text-transform:uppercase;color:var(--brass-hi);text-shadow:0 1px 2px #000,0 0 10px #000,0 0 3px #000}

/* „Bescheid zum Release“ */
.start-inhalt{position:relative;z-index:1;margin-top:auto;display:flex;justify-content:center;padding:28px 24px 12px}
.vormerken{width:min(640px,100%);padding:20px 24px 18px;background:rgba(14,10,6,.88)}
.vormerken h2{font-size:30px}
.vm-text{margin-top:6px;font:400 16.5px/1.5 var(--f-text);color:var(--ink)}
.vm-form{position:relative;margin-top:14px;display:flex;gap:10px}
.vm-form input[type=email]{flex:1;min-width:0;min-height:48px;padding:10px 14px;border:2px solid var(--brass-lo);border-radius:4px;background:rgba(0,0,0,.62);color:var(--ink);font:500 17px/1.2 var(--f-ui)}
.vm-form input[type=email]::placeholder{color:var(--ink-faint)}
.vm-form input[type=email]:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px rgba(255,210,26,.25)}
.vm-falle{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.vm-klein{margin-top:10px;font:500 13.5px/1.4 var(--f-ui);color:var(--ink-dim)}
.vm-meldung{margin-top:12px;padding:10px 12px;border-radius:4px;font:600 15.5px/1.4 var(--f-ui)}
.vm-meldung.gut{border:1px solid #3f7a2a;background:rgba(63,122,42,.25);color:#c8f5b8}
.vm-meldung.schlecht{border:1px solid #8a3a2c;background:rgba(138,58,44,.25);color:#ffc4b8}

/* Fuß über dem Bild */
.fuss{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-end;gap:12px 16px;flex-wrap:wrap;padding:12px 24px 18px;font:600 14px/1.2 var(--f-ui);color:rgba(243,231,201,.85);text-shadow:1px 1px 1px #000,0 0 6px #000}
.fuss nav{display:flex;gap:6px 10px;align-items:center;flex-wrap:wrap}
.fuss nav a{color:rgba(243,231,201,.92);text-decoration:none}
.fuss nav a:hover{color:#fff4c0;text-decoration:underline}
.fuss .status{padding:7px 13px;border-radius:999px;background:rgba(12,9,5,.62);border:1px solid var(--brass-lo)}

@media (max-width:1180px){
  .start-kopf{grid-template-columns:minmax(0,1fr);justify-items:center;gap:22px;padding-top:32px}
  .start-kopf nav{flex-direction:row;flex-wrap:wrap;justify-content:center}
  .start-kopf .nl,.start-kopf .nr{align-items:center}
  .start-kopf .navi{width:auto}
  .start-kopf .mitte{order:-1}
}
@media (max-width:760px){
  .start-kopf{display:flex;flex-direction:column;align-items:stretch;gap:10px;padding:26px 16px 0}
  .start-kopf .mitte{margin-bottom:10px}
  .start .logo .l1{font-size:60px}
  .start .logo .l2{margin-top:8px;font-size:17px}
  .claim{margin-top:16px;font-size:32px}
  .claim2{font-size:12.5px;letter-spacing:.14em}
  .start-kopf nav{flex-direction:column;gap:10px}
  .start-kopf .navi{width:100%;min-height:50px;font-size:20px}
  .start-inhalt{padding:22px 16px 8px}
  .vormerken{padding:18px 16px 16px}
  .vormerken h2{font-size:26px}
  .vm-form{flex-direction:column}
  .vm-form .btn{width:100%}
  .fuss{justify-content:center;text-align:center;padding:14px 16px 18px}
  .fuss nav{justify-content:center}
}
@media (max-height:760px) and (min-width:761px){
  .start-kopf{padding-top:28px}
  .start .logo .l1{font-size:88px}
  .claim{margin-top:16px;font-size:36px}
}

/* Baustellenseite (Baustellenmodus) */
.baustelle .start-kopf{grid-template-columns:minmax(0,1fr)}
.baustelle .mitte{justify-self:center}
.baustelle .claim2{margin-top:18px}
.baustelle .start-inhalt{margin-top:auto;margin-bottom:auto;padding-top:24px}
.baustellen-schild{text-align:center}
.bs-ikon{font:46px/1 var(--f-emoji)}
.baustellen-schild h1{margin:10px 0 0;font:700 36px/1.1 var(--f-display);color:var(--brass-hi);text-shadow:1px 1px 2px #000}
.baustellen-schild .vm-text{margin-top:10px;font-size:18px}
@media (max-width:760px){.baustellen-schild h1{font-size:30px}.baustellen-schild .vm-text{font-size:16.5px}}
