/* Über uns: „22:41 Uhr“ (Erwin 19.10.2026, Entwurf Variante 1) */
/* Gemeinsame Hülle der vier Varianten. Die rechte Textkarte (.owners-card) bleibt unverändert aus stil.css. */
:root{--hand:'Segoe Print','Bradley Hand','Bradley Hand ITC',cursive}

.w-stage{position:relative;height:560px;padding-right:48px;border-radius:24px;overflow:hidden;box-shadow:0 24px 60px #00143c22;isolation:isolate;display:grid;place-items:center}
.w-inner{position:relative;width:min(485px,100%);aspect-ratio:485/560;container-type:inline-size}
.w-hint{position:absolute;left:14px;top:12px;z-index:6;font:500 10.5px/1 Inter,Arial,sans-serif;letter-spacing:.02em;color:#546476;background:rgba(255,255,255,.82);border:1px dashed #9db3cb;border-radius:99px;padding:5px 9px}
.w-hint.dark{color:#c5d6ea;background:rgba(15,28,44,.55);border-color:#6f8cad}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:1000px){
  .w-stage{height:auto;padding:0 0 48px}
}
@media(max-width:767px){
  .w-stage{border-radius:14px}
}

.w1{background:radial-gradient(120% 90% at 70% 0%,#3f6794 0%,#2a4666 45%,#1a2d45 100%)}
.w1 .w-inner{aspect-ratio:auto;height:100%;display:flex;justify-content:center;container-type:normal}
.w1 .sky{position:absolute;inset:0;z-index:0;pointer-events:none}
.w1 .phone{position:relative;z-index:1;width:min(296px,100%);height:100%;margin-top:34px;border:9px solid #0d1826;border-bottom:0;border-radius:46px 46px 0 0;background:linear-gradient(170deg,#4d78a6 0%,#2f5079 38%,#1c3250 100%);box-shadow:0 30px 60px #00091a66,0 0 0 1.5px #5a7391 inset;overflow:hidden;color:#fff}
.w1 .phone:before{content:'';position:absolute;top:10px;left:50%;width:84px;height:24px;margin-left:-42px;border-radius:14px;background:#0d1826}
.w1 .day{margin:52px 0 0;text-align:center;font:500 13px/1 Inter,Arial,sans-serif;color:#d6e4f5;letter-spacing:.02em}
.w1 .clock{display:block;margin:6px 0 0;text-align:center;font:500 68px/1 'Inter Tight',Inter,Arial,sans-serif;letter-spacing:-.02em;color:#fff}
.w1 .stack{list-style:none;margin:16px 0 0;padding:0 11px;display:grid;gap:7px}
.w1 .msg{display:grid;grid-template-columns:26px 1fr auto;column-gap:9px;align-items:start;padding:9px 11px 10px;border-radius:17px;background:rgba(246,249,253,.9);color:#1f3550;box-shadow:0 6px 16px #00112b33}
.w1 .msg .ic{grid-row:1/3;width:26px;height:26px;border-radius:8px;background:#dfe9f6;display:grid;place-items:center;color:#2576d3}
.w1 .msg .ic svg{width:15px;height:15px}
.w1 .msg b{font:600 12.5px/1.2 Inter,Arial,sans-serif;color:#1f3550}
.w1 .msg time{font:400 11px/1.2 Inter,Arial,sans-serif;color:#7b8ca1}
.w1 .msg p{grid-column:2/4;margin:2px 0 0;font:400 13px/1.3 Inter,Arial,sans-serif;color:#33475f}
.w1 .msg.br{margin-top:9px;background:rgba(255,255,255,.97);border-left:4px solid var(--akzent);padding-left:10px}
.w1 .msg.br .ic{background:var(--navy);color:var(--akzent)}
.w1 .msg.br p{color:#1f3550;font-weight:500}
.w1 .msg.br .ok{display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#13c883;color:#fff;margin-right:5px;vertical-align:-3px}
.w1 .msg.br .ok svg{width:9px;height:9px}
@keyframes w1in{from{opacity:0;transform:translateY(-16px) scale(.96)}to{opacity:1;transform:none}}
@keyframes w1dim{to{opacity:.74}}
.w1.armed .msg{opacity:0}
.w1.play .msg{animation:w1in .65s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*.95s + .35s)}
.w1.play .msg.br{animation-delay:5.6s;animation-duration:1s}
.w1.play .msg:not(.br){animation:w1in .65s cubic-bezier(.2,.8,.2,1) both,w1dim 1.2s ease 6.4s forwards;animation-delay:calc(var(--i)*.95s + .35s),6.4s}
@media(max-width:1000px){.w1{height:520px;padding:0}.w1 .w-inner{width:min(300px,100%)}}
@media(max-width:767px){.w1{height:auto;padding:0}.w1 .w-inner{height:610px;width:min(330px,100%)}.w1 .phone{margin-top:40px;width:100%}.w1 .clock{font-size:60px}.w1 .stack{margin-top:12px}}
.warum-abend .w-stage{height:600px;padding-right:0}
.warum-abend{max-width:460px;margin:auto;width:100%}
@media(max-width:767px){.warum-abend .w-stage{height:auto}}
.sally-kann{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:10px}
.sally-kann li{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid #e1e8f0;border-radius:14px;background:#fff}
.sally-kann li>span{font-size:22px;line-height:1.2}
.sally-kann b{display:block;color:var(--navy);font-size:16px}
.sally-kann small{display:block;color:#546476;font-size:14px;line-height:1.45;margin-top:2px}

.w1 .msg.br .ic img{width:16px;height:16px;display:block}
