/* ===== Haus-Seiten (Vorlagen 12.10.2026, Stand v0.27) =====
   Hausfarbe nur über der Skyline und für Schrift. Abschnitte wechseln zwischen Beige (#fbf6f0) und Sand (#e2cfb8),
   keine Punkt-Linien mehr. Hotel #5a1d23, Bodega #77142a, Kartoffelhaus #401d06 */
.phone.t-hotel{--fc:#5a1d23} .phone.t-bodega{--fc:#77142a} .phone.t-kh{--fc:#401d06}
.phone.t-hotel .screen,.phone.t-bodega .screen,.phone.t-kh .screen{background:#fbf6f0}
.phone.t-hotel .ptr,.phone.t-bodega .ptr,.phone.t-kh .ptr{color:#fbf6f0;background:var(--fc)}
.hx{--beige:#fbf6f0; --sand:#e2cfb8; background:var(--fc);padding-top:26px;min-height:100%;display:flex;flex-direction:column}
.hx > .hp{flex:1}
.hx .sky{display:block;width:100%;height:auto;fill:var(--beige);margin-bottom:-1px}
.phone .hx > .hp.hp{--hg:var(--beige); --hb:var(--fc); --hb2:color-mix(in srgb,var(--fc) 80%,var(--beige)); --hline:color-mix(in srgb,var(--fc) 88%,var(--beige));
  --ph1:#e9dccb; --ph2:#d6c1a6; background:var(--beige);color:var(--fc);overflow:hidden;min-height:0;padding:0}
/* Abschnitte */
.hx .sc{padding:36px 0}
.hx .sc.alt{background:var(--sand); --ph1:#efe4d6; --ph2:#d9c4aa}
.hx .sc:first-child{padding-top:8px}
.hx .hp h1{padding-top:0}
.hx .hp:not(.bp) h1{text-align:center}
.hx .tl{height:5px;background:var(--sand);margin:18px 22px 22px;border-radius:3px}
.hx .hp h2{margin-bottom:16px}
.hx .hp h2.lft{margin-bottom:0}
.hx .dl,.hx .fl{display:none}
.hx .car-wrap{margin:0}
.hx .sc.alt .car{margin-top:-10px}
.hx .bp .hours{padding-top:18px}
.hx .rowhd{margin-top:18px}
.hx .bp .swh{margin:0 0 4px}
.hx .openbtn{margin-top:16px}
.hx .room{padding:0}
.hx .room .frame{margin-left:-46px}
.hx .web{margin-top:0}
.hx .hp .foot{padding-top:14px}
/* Karussell */
.hx .slide{color:var(--fc)}
.hx .dots{margin-top:10px}
.hx .dots i{background:color-mix(in srgb,var(--fc) 30%,var(--beige))}
.hx .dots i.on{background:var(--fc)}
.hx .slide.on{box-shadow:0 14px 28px -14px color-mix(in srgb,var(--fc) 60%,transparent)}
/* Angebots- und Aktionskarten (Variante A, 12.10.): ein Rahmen in Hausfarbe, Foto randlos oben, Button im Beigen */
.hx .ac{border:1.5px solid var(--fc);padding:0;background:var(--beige);min-height:0;border-radius:12px;overflow:hidden}
.hx .ac .in{border:0;padding:0 16px}
.hx .ac .aimg{aspect-ratio:16/10;margin:0 -16px 16px;background:linear-gradient(140deg,var(--ph1),var(--ph2));display:grid;place-content:center;justify-items:center;gap:4px;color:var(--hb2);font-size:.8rem}
.hx .sc.alt .ac .aimg,.hx .ac .aimg{--ph1:#d9c4aa; --ph2:#b89874; color:#fbf6f0}
.hx .ac .aimg svg{width:28px;height:28px;opacity:.85}
.hx .ac .t{margin-top:.35rem}
.hx .ac .ww{border-top:0;padding-top:0;margin-top:14px}
.hx .ac .acbtn,.hx .ac .acpick{margin:18px 16px 16px}
.hx .ac .acbtn{outline:0}
.hx .ac button.acbtn{width:auto;display:block}
/* Datum als Kasten oben links im Foto (Vorlage 12.10.) */
.hx .ac .aimg{position:relative}
.hx .ac .adate{position:absolute;top:12px;left:12px;background:var(--fc);color:var(--beige);font-family:var(--caps);text-transform:uppercase;letter-spacing:.08em;font-weight:600;font-size:.8rem;line-height:1;padding:.55rem .7rem .45rem;max-width:calc(100% - 24px)}
/* Sprung aus dem Kalender: Aktion kurz hervorheben */
.hx .ac.flash{animation:acflash 2.2s ease-out}
@keyframes acflash{0%,35%{box-shadow:0 0 0 5px var(--fc)}100%{box-shadow:0 0 0 0 transparent}}
@media (prefers-reduced-motion:reduce){.hx .ac.flash{animation:none;box-shadow:0 0 0 4px var(--fc)}}
/* Eigene Fotos aus der Verwaltung */
.hx .ac .aimg.ph{background-size:cover;background-position:center}
.hx .slide.img{background-size:cover;background-position:center}
.hx .none-a{margin:0 22px;font-size:.92rem;color:var(--fc);opacity:.8}
.hx .room .img.ph{background-size:cover;background-position:center}