/* Teewelt-Comeback: eigenständige Ankündigung im ersten Bildschirm. */
.hero-inner.hero-layout { max-width: none; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: center; gap: 54px; padding: 48px 0 64px; }
.hero-copy { min-width: 0; }
.tea-comeback { position: relative; padding: 26px; border-radius: 8px 38px 8px 38px; background: #faf6f1; color: #3a2f2c; border: 2px solid #e9d9c7; box-shadow: 0 24px 64px #160c164d; transform: rotate(1.5deg); }
.tea-comeback::before { content: ''; position: absolute; inset: 8px; border: 1px solid #d4bf9e; border-radius: 3px 29px 3px 29px; pointer-events: none; }
.tea-comeback-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tea-comeback-badge { display: inline-block; padding: 6px 13px; border-radius: 999px; background: #a3265a; color: #fff; font-weight: 800; font-size: .85rem; transform: rotate(-5deg); white-space: nowrap; }
.tea-comeback-label { max-width: 135px; font-size: .68rem; font-weight: 700; letter-spacing: .12em; line-height: 1.5; text-transform: uppercase; color: #526447; text-align: right; }
.tea-comeback-art { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 14px 0 8px; color: #526447; }
.tea-comeback-art svg { width: 140px; height: 119px; flex-shrink: 0; }
.tea-comeback-art > span { font-family: var(--serif); font-size: 1.7rem; line-height: 1.05; transform: rotate(-7deg); }
.tea-comeback-art em { font-size: 1.3rem; }
.hero .tea-comeback h2 { font-size: clamp(1.5rem, 2.3vw, 2rem); color: #3a2f2c; line-height: 1.2; }
.tea-comeback h2 em { color: #a3265a; }
.hero .tea-comeback p { color: #64564c; font-size: .96rem; line-height: 1.6; text-shadow: none; margin: 12px 0 18px; }
.tea-comeback-cta { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 12px 19px; background: #a3265a; color: #fff; border-radius: 999px; font-weight: 750; font-size: .98rem; }
.tea-comeback-cta:hover { color: #fff; background: #841d49; transform: translateY(-2px); }
.tea-comeback-cta:focus-visible { outline: 3px solid #526447; outline-offset: 4px; }
.tea-comeback small { display: block; margin-top: 12px; color: #64564c; font-size: .72rem; line-height: 1.5; }
#tee { scroll-margin-top: 98px; }
.menu { gap: 18px; }
.menu a { font-size: .9rem; }
@media (max-width: 1100px) {
  body > header .menu { position: fixed; inset: 76px 0 auto; display: flex; flex-direction: column; gap: 0; background: var(--bg); border-bottom: 1px solid var(--line); padding: 8px 0; transform: translateY(-120%); visibility: hidden; transition: transform .35s ease, visibility .35s; max-height: calc(100dvh - 76px); overflow-y: auto; }
  body > header .menu.open { transform: translateY(0); visibility: visible; }
  body > header .menu li { width: 100%; }
  body > header .menu a { display: block; padding: 12px 24px; width: 100%; min-height: 48px; }
  body > header .menu a::after { display: none; }
  body > header .burger { display: flex; }
  .hero-inner.hero-layout { gap: 28px; }
  .tea-comeback { transform: none; padding: 22px; }
  .hero-copy h1 { font-size: 3rem; }
}
@media (max-width: 760px) {
  .hero-inner.hero-layout { grid-template-columns: minmax(0, 1fr); padding: 24px 0 72px; gap: 38px; }
  .tea-comeback { order: -1; width: 100%; max-width: 430px; justify-self: center; padding: 22px; }
  .tea-comeback-art { margin: 8px 0; }
  .tea-comeback-art svg { width: 106px; height: 90px; }
  .hero .tea-comeback h2 { font-size: 1.6rem; }
  .hero .tea-comeback p { font-size: .9rem; margin: 10px 0 14px; }
  .hero-copy h1 { font-size: clamp(2.4rem, 7vw, 3rem); }
}
/* Einmaliger Blickfang, insgesamt unter fünf Sekunden; keine Dauerschleife. */
@media (prefers-reduced-motion: no-preference) {
  .tea-comeback { --tea-rest-angle: 1.5deg; animation: teaComebackEntrance 1.1s cubic-bezier(.2,.75,.25,1) both; }
  .tea-comeback::after { content: ''; position: absolute; inset: 2px; border-radius: inherit; pointer-events: none; opacity: 0; background: linear-gradient(110deg, transparent 28%, #fff9 45%, transparent 62%); background-size: 300% 100%; animation: teaComebackShine 1.3s ease-out 1.1s 1 both; }
  .tea-comeback-badge { animation: teaComebackBadge .8s ease-in-out 1s 2; }
  .tea-steam path { transform-box: fill-box; transform-origin: center; animation: teaComebackSteam 1.5s ease-in-out 2; }
  .tea-steam path:nth-child(2) { animation-delay: .25s; }
  .tea-steam path:nth-child(3) { animation-delay: .5s; }
  .tea-comeback-cta { animation: teaComebackInvite 1s ease-out 2.5s 2; }
}
@keyframes teaComebackEntrance {
  0% { transform: translateY(22px) rotate(-3deg) scale(.96); }
  55% { transform: translateY(-6px) rotate(2.5deg) scale(1.015); }
  78% { transform: translateY(2px) rotate(-.7deg) scale(1); }
  100% { transform: translateY(0) rotate(var(--tea-rest-angle)) scale(1); }
}
@keyframes teaComebackShine {
  0% { background-position: 100% 0; opacity: 0; }
  15%, 75% { opacity: .6; }
  100% { background-position: 0% 0; opacity: 0; }
}
@keyframes teaComebackBadge {
  0%, 100% { transform: rotate(-5deg) scale(1); }
  50% { transform: rotate(2deg) scale(1.08); }
}
@keyframes teaComebackSteam {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(-7px); opacity: .35; }
}
@keyframes teaComebackInvite {
  0%, 100% { box-shadow: 0 0 0 0 #a3265a00; }
  50% { box-shadow: 0 0 0 7px #a3265a22; }
}
@media (max-width: 1100px) {
  .tea-comeback { --tea-rest-angle: 0deg; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body > header .menu, .tea-comeback-cta { transition: none; }
}