@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--ink:#173c34;--moss:#497a62;--paper:#f5f3e9;--sun:#e7bb62;--muted:#68766b;font-family:'DM Sans',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}a{color:inherit}a:focus-visible{outline:3px solid #bb673e;outline-offset:4px}.site-header{height:90px;padding:0 7vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #173c341c}.wordmark{text-decoration:none;font-weight:700;letter-spacing:.04em}.wordmark span{font-size:.65rem;letter-spacing:.13em;color:var(--muted);margin-left:.5em}.site-header nav{display:flex;gap:2.1rem}.site-header nav a{text-decoration:none;color:var(--muted);font-size:.88rem}.site-header nav a:hover,.site-header nav a[aria-current]{color:var(--ink)}.site-header nav a[aria-current]{text-decoration:underline;text-underline-offset:7px}main{min-height:calc(100vh - 155px)}.hero{position:relative;overflow:hidden;min-height:640px;padding:125px 12vw 100px}.eyebrow{font-size:.69rem;font-weight:600;letter-spacing:.19em;color:var(--moss)}h1,h2{font-family:Manrope,sans-serif}h1{font-size:clamp(3.5rem,7vw,7rem);line-height:.99;letter-spacing:-.065em;margin:28px 0}.intro{max-width:490px;line-height:1.75;color:var(--muted);font-size:1.08rem}.button{display:inline-flex;gap:2rem;align-items:center;margin-top:27px;padding:16px 21px;background:var(--ink);color:white;text-decoration:none;font-size:.88rem}.button:hover{background:var(--moss)}.tea-art{position:absolute;right:9%;top:20%;width:290px;height:360px;display:flex;align-items:center;justify-content:center;gap:16px;color:var(--moss);font-family:serif;font-size:4rem;transform:rotate(8deg);border-radius:50% 50% 43% 45%;background:radial-gradient(ellipse at 50% 38%,#e7bb6260 0 10%,transparent 11%),radial-gradient(ellipse at 54% 45%,#497a6233 0 30%,transparent 31%)}.tea-art span:nth-child(2){font-size:8rem;color:#bb8f42}.note{padding:85px 12vw;background:#e8ebde}.note h2{font-size:clamp(2.4rem,4vw,4rem);line-height:1.08;letter-spacing:-.04em}.note>p:not(.eyebrow){color:var(--muted);line-height:1.7}.text-link{display:inline-block;margin-top:18px;text-underline-offset:5px;font-size:.9rem}.subpage{padding:94px 12vw 120px}.subpage h1{font-size:clamp(3.5rem,6vw,6rem)}.tea-list{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:65px 0 30px}.tea-list article{padding:27px 25px;border-top:1px solid #497a6280;background:#e8ebde}.tea-list article span{font-size:.66rem;letter-spacing:.15em;color:var(--moss)}.tea-list h2{font-size:1.5rem}.tea-list p,.visit-card p{color:var(--muted);line-height:1.7}.visit-card{margin:65px 0 25px;padding:35px;background:#e8ebde;display:flex;align-items:center;gap:50px;max-width:650px}.tea-art.small{position:static;width:130px;height:120px;flex:none;font-size:2rem;border-radius:50%;transform:none}.visit-card h2{font-size:1.4rem}footer{padding:25px 7vw;border-top:1px solid #173c341c;display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.72rem}footer a{text-decoration:none}@media(max-width:760px){.site-header{height:auto;min-height:78px;padding:17px 6vw;align-items:flex-start;gap:18px;flex-direction:column}.site-header nav{gap:1.3rem}.hero{min-height:650px;padding:90px 8vw 70px}.hero .tea-art{top:auto;bottom:0;right:2%;width:210px;height:250px;font-size:3rem;opacity:.75}.tea-art span:nth-child(2){font-size:5rem}.intro{font-size:1rem}.note,.subpage{padding:70px 8vw}.tea-list{grid-template-columns:1fr;margin-top:45px}.visit-card{padding:24px;gap:20px}.tea-art.small{width:85px;height:85px}footer{padding:22px 6vw;flex-direction:column}}

/* Isolierter Bildslot; übrige Factory-Stile aus PR #23 unverändert kopiert. */
.tea-art .hero-photo{position:absolute;inset:17% 17%;width:66%;height:66%;object-fit:cover;border-radius:46%;opacity:.78}.tea-art>span{position:relative;z-index:1}.cms-price,.cms-hours{font-weight:600;color:var(--ink)}

/* Keep the artwork in the document flow on narrow screens; the desktop hero stays unchanged. */
@media (max-width: 900px) {
  .site-header{height:auto;min-height:90px;padding:18px 7vw;flex-wrap:wrap;gap:16px 24px}
  .site-header nav{gap:clamp(1rem,3vw,2.1rem)}
  .hero{min-height:auto;padding:84px 7vw 64px}
  h1{font-size:clamp(3rem,9vw,5rem)}
  .hero h1{max-width:13ch}
  .tea-art{position:relative;inset:auto;width:min(100%,290px);height:280px;margin:40px auto 0;flex:none}
  .tea-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .note{padding:64px 7vw}
}
@media (max-width: 480px) {
  .site-header{padding:16px 6vw;gap:14px}
  .site-header nav{width:100%;justify-content:space-between;gap:1rem}
  .hero{padding:64px 6vw 48px}
  h1{font-size:clamp(2.65rem,12vw,3.6rem)}
  .hero h1{max-width:12ch;margin:22px 0}
  .intro{font-size:1rem}
  .button{gap:1.4rem}
  .tea-art{height:250px;margin-top:32px}
  .tea-list{grid-template-columns:1fr}
  .note{padding:56px 6vw}
}