#pas-tafel{ --pt-beige:#efe8d9; --pt-ink:#3f3f38; --pt-lbl:#4a4a44; --pt-blue:#0e7490; box-sizing:border-box; padding:0; /* Full-Bleed: sprengt den Avada-Container und geht über die volle Fensterbreite */ width:100vw; max-width:100vw; position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; background:transparent; container-type:inline-size; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; } #pas-tafel *,#pas-tafel *::before,#pas-tafel *::after{box-sizing:border-box;} #pas-tafel .pt-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;} #pas-tafel .pt-inner{ display:grid; grid-template-columns:42fr 16fr 42fr; grid-template-areas:"map mid photo"; aspect-ratio:3968 / 2551; background:var(--pt-beige); overflow:hidden; } #pas-tafel .pt-col{min-width:0; height:100%;} #pas-tafel .pt-map{grid-area:map;} #pas-tafel .pt-mid{grid-area:mid;} #pas-tafel .pt-photo{grid-area:photo;} #pas-tafel .pt-map img,#pas-tafel .pt-photo img{width:100%; height:100%; object-fit:cover; object-position:center; display:block;} /* Mittlere Spalte – skaliert per Container-Einheiten (cqw) mit der Breite */ #pas-tafel .pt-mid{display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:1cqw; padding:2cqw 2%; height:100%;} #pas-tafel .pt-icons{display:flex; flex-direction:column; align-items:center; gap:0.8cqw; width:100%; margin:0; padding:0;} #pas-tafel .pt-tile{ display:flex; flex-direction:column; align-items:center; gap:0.6cqw; text-decoration:none; color:var(--pt-lbl); padding:0.7cqw 0.4cqw; border-radius:1cqw; background:transparent; border:1px solid transparent; transition:transform .15s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease; } #pas-tafel .pt-ico{display:flex; align-items:flex-end; justify-content:center;} #pas-tafel .pt-ico img{height:3cqw; width:auto; max-width:100%; display:block;} #pas-tafel .pt-lbl{font-size:1.1cqw; font-weight:600; text-align:center; line-height:1.15;} #pas-tafel .pt-tile:hover,#pas-tafel .pt-tile:focus-visible{ transform:translateY(-2px); background:#fff; border-color:#e4dcc9; box-shadow:0 8px 20px -8px rgba(30,60,80,.35); outline:none; color:var(--pt-blue); } #pas-tafel .pt-tile:focus-visible{outline:2px solid var(--pt-blue); outline-offset:2px;} #pas-tafel .pt-qr{display:block; line-height:0; border-radius:1cqw; transition:transform .15s ease;} #pas-tafel .pt-qr img{width:6.5cqw; height:6.5cqw; display:block;} #pas-tafel .pt-qr:hover,#pas-tafel .pt-qr:focus-visible{transform:scale(1.05); outline:none;} #pas-tafel .pt-qr:focus-visible{outline:2px solid var(--pt-blue); outline-offset:3px;} #pas-tafel .pt-legend{width:100%; display:flex; flex-direction:column; align-items:center; gap:0.5cqw;} #pas-tafel .pt-legend h3{margin:0; font-size:1.25cqw; font-weight:700; color:var(--pt-ink); align-self:flex-start; padding-left:4%;} #pas-tafel .pt-legend img{width:10.5cqw; max-width:90%; height:auto; display:block;} /* Gestapelt auf schmalen Breiten */ @media (max-width:819px){ #pas-tafel .pt-inner{grid-template-columns:1fr; grid-template-areas:"photo" "mid" "map"; aspect-ratio:auto;} #pas-tafel .pt-map img{height:auto; object-fit:contain;} #pas-tafel .pt-photo img{height:auto; max-height:60vw; object-fit:cover; object-position:center 35%;} #pas-tafel .pt-mid{justify-content:flex-start; gap:18px; padding:22px 14px 24px;} #pas-tafel .pt-icons{flex-direction:row; flex-wrap:wrap; justify-content:center; gap:12px;} #pas-tafel .pt-tile{flex:0 1 128px; gap:8px; padding:12px 6px; border-radius:12px;} #pas-tafel .pt-ico img{height:52px;} #pas-tafel .pt-lbl{font-size:.9rem;} #pas-tafel .pt-qr img{width:120px; height:120px;} #pas-tafel .pt-legend h3{font-size:1rem;} #pas-tafel .pt-legend img{width:auto; max-width:230px;} } @media (prefers-reduced-motion:reduce){ #pas-tafel .pt-tile,#pas-tafel .pt-qr{transition:none;} }