/* ========================================================================= Poolse Catering & Events & Foodtruck – style motywu Kolory: czerwony / biały / czarny / ciemny szary (z logo) ========================================================================= */ @font-face { font-family: "Outfit"; src: url("../fonts/outfit.woff") format("woff"); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: "Manrope"; src: url("../fonts/manrope.woff") format("woff"); font-weight: 200 800; font-style: normal; font-display: swap; } :root { /* Paleta marki: czerwień z logo, czarny #1b1b1b, złamana biel + szare akcenty */ --p-red: #D61C1D; --p-red-dark: #B01718; --p-red-on-dark: #D61C1D; --p-red-soft: #F7E4E0; --p-black: #1B1B1B; --p-ink: #1B1B1B; --p-graphite: #3A3A3A; --p-graphite-2: #2A2A2A; --p-grey: #7A7874; --p-line: #E6E1D9; --p-light: #F1EDE6; --p-white: #FBF8F3; --p-head: "Outfit", "Manrope", system-ui, sans-serif; --p-body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif; --p-container: 1240px; --p-gutter: clamp(16px, 4vw, 32px); --p-radius: 20px; --p-radius-sm: 12px; --p-shadow: 0 1px 2px rgba(27, 27, 27, .04), 0 12px 32px -12px rgba(27, 27, 27, .16); --p-shadow-lg: 0 2px 4px rgba(27, 27, 27, .04), 0 28px 60px -20px rgba(27, 27, 27, .28); --p-ease: cubic-bezier(.2, .7, .2, 1); --p-sec-pad: clamp(64px, 9vw, 120px); } /* ---------- Podstawy ---------- */ *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 100px; } body { margin: 0; font-family: var(--p-body); font-size: 17px; line-height: 1.65; color: var(--p-graphite); background: var(--p-white); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; } img, svg, video { max-width: 100%; height: auto; } img { display: block; } a { color: var(--p-red); text-decoration-thickness: 1.5px; text-underline-offset: 3px; } a:hover { color: var(--p-red-dark); } h1, h2, h3, h4, h5, h6 { font-family: var(--p-head); color: var(--p-black); line-height: 1.12; letter-spacing: -.015em; margin: 0 0 .5em; font-weight: 700; } p { margin: 0 0 1em; } p:last-child { margin-bottom: 0; } :focus-visible { outline: 3px solid var(--p-red); outline-offset: 3px; border-radius: 4px; } ::selection { background: var(--p-red); color: var(--p-white); } .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; word-wrap: normal !important; } .skip-link:focus { clip: auto; clip-path: none; height: auto; width: auto; z-index: 1000; top: 8px; left: 8px; padding: 12px 18px; background: var(--p-white); color: var(--p-black); border-radius: 8px; box-shadow: var(--p-shadow); } .poolse-container { width: 100%; max-width: calc(var(--p-container) + 2 * var(--p-gutter)); margin: 0 auto; padding: 0 var(--p-gutter); } .poolse-container--narrow { max-width: calc(780px + 2 * var(--p-gutter)); } .poolse-section { padding: var(--p-sec-pad) 0; } .poolse-section--tight { padding: 40px 0 72px; } /* ---------- Przyciski ---------- */ .poolse-btn, .poolse-el-btn .elementor-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 28px; border-radius: 999px; border: 2px solid transparent; font-family: var(--p-head); font-weight: 600; font-size: 16px; line-height: 1.2; letter-spacing: .01em; text-decoration: none; cursor: pointer; transition: background-color .2s var(--p-ease), color .2s var(--p-ease), border-color .2s var(--p-ease), transform .2s var(--p-ease), box-shadow .2s var(--p-ease); } .poolse-btn:hover, .poolse-el-btn .elementor-button:hover { transform: translateY(-2px); } .poolse-btn.poolse-btn--red, .poolse-el-btn .elementor-button { background: var(--p-red); color: var(--p-white); box-shadow: 0 10px 24px -10px rgba(214, 28, 29, .7); } .poolse-btn.poolse-btn--red:hover, .poolse-el-btn .elementor-button:hover { background: var(--p-red-dark); color: var(--p-white); } .poolse-btn.poolse-btn--dark { background: var(--p-ink); color: var(--p-white); } .poolse-btn.poolse-btn--dark:hover { background: var(--p-graphite-2); color: var(--p-white); } .poolse-btn.poolse-btn--white { background: var(--p-white); color: var(--p-red); } .poolse-btn.poolse-btn--white:hover { background: var(--p-ink); color: var(--p-white); } .poolse-btn.poolse-btn--ghost { background: transparent; color: var(--p-black); border-color: var(--p-line); } .poolse-btn.poolse-btn--ghost:hover { border-color: var(--p-black); color: var(--p-black); } .poolse-btn.poolse-btn--outline-light { background: transparent; color: var(--p-white); border-color: rgba(255, 255, 255, .55); } .poolse-btn.poolse-btn--outline-light:hover { background: var(--p-white); color: var(--p-black); border-color: var(--p-white); } .poolse-link { display: inline-flex; align-items: center; gap: 6px; font-family: var(--p-head); font-weight: 600; color: var(--p-red); text-decoration: none; } .poolse-link .poolse-icon { width: 18px; height: 18px; transition: transform .2s var(--p-ease); } .poolse-link:hover .poolse-icon, .has-link:hover .poolse-link .poolse-icon { transform: translateX(4px); } .poolse-kicker { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 14px; font-family: var(--p-head); font-size: 13px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--p-red); } .poolse-kicker::before { content: ""; width: 28px; height: 2px; background: currentColor; border-radius: 2px; } .poolse-kicker--light { color: var(--p-white); } .poolse-kicker--light::before { background: var(--p-red); height: 3px; } /* Górny pasek + nagłówek: patrz sekcja „NAGŁÓWEK” na końcu pliku. */ /* ---------- Sekcje (kontenery Elementora i fallback) ---------- */ .e-con.poolse-sec { --padding-top: var(--p-sec-pad); --padding-bottom: var(--p-sec-pad); --padding-left: var(--p-gutter); --padding-right: var(--p-gutter); } .e-con.poolse-sec--pad-tight { --padding-top: 48px; --padding-bottom: 48px; } .e-con.poolse-sec--pad-bottom { --padding-top: 0px; } .e-con.poolse-sec--pad-none { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; } .e-con.poolse-row, .e-con.poolse-col, .e-con.poolse-grid { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; } .poolse-fb-con.poolse-sec { padding: var(--p-sec-pad) 0; } .poolse-fb-con.poolse-sec--pad-tight { padding: 48px 0; } .poolse-fb-con.poolse-sec--pad-bottom { padding-top: 0; } .poolse-fb-con.poolse-sec--pad-none { padding: 0; } .poolse-fb-inner { max-width: calc(var(--p-container) + 2 * var(--p-gutter)); margin: 0 auto; padding: 0 var(--p-gutter); display: flex; flex-direction: column; gap: 40px; } .poolse-fb-con { display: flex; flex-direction: column; gap: 24px; } .poolse-fb-con.poolse-sec { gap: 0; } .poolse-fb-row { display: flex; flex-direction: row; align-items: center; gap: 56px; } .poolse-fb-row > .poolse-fb-con { width: calc(var(--w, 50%) - 28px); flex-shrink: 0; } .poolse-fb-grid { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 24px; } @media (max-width: 1024px) { .poolse-fb-row { flex-direction: column; align-items: stretch; gap: 32px; } .poolse-fb-row > .poolse-fb-con { width: 100%; } .poolse-fb-grid { grid-template-columns: repeat(var(--cols-t, 2), minmax(0, 1fr)); } } @media (max-width: 767px) { .poolse-fb-grid { grid-template-columns: 1fr; } } .poolse-sec--light { background-color: var(--p-light); } .poolse-sec--dark { background-color: var(--p-ink); } .poolse-sec--black { background-color: var(--p-ink); } .poolse-sec--red { background-color: var(--p-red); } .poolse-sec--dark, .poolse-sec--black, .poolse-sec--red { color: rgba(255, 255, 255, .82); } .poolse-sec--dark :is(h1, h2, h3, h4), .poolse-sec--black :is(h1, h2, h3, h4), .poolse-sec--red :is(h1, h2, h3, h4) { color: var(--p-white); } .poolse-sec--dark .poolse-kicker, .poolse-sec--black .poolse-kicker { color: var(--p-red-on-dark); } .poolse-sec--red .poolse-kicker { color: var(--p-white); } .poolse-sec--dark .elementor-widget-text-editor, .poolse-sec--black .elementor-widget-text-editor { color: rgba(255, 255, 255, .82); } .poolse-sec--dark a:not(.poolse-btn):not(.elementor-button), .poolse-sec--black a:not(.poolse-btn):not(.elementor-button) { color: var(--p-red-on-dark); } /* Jasne karty w ciemnych sekcjach – nagłówki zostają czarne */ .poolse-sec :is(.poolse-package:not(.is-featured), .poolse-service, .poolse-dish, .poolse-event, .poolse-card, .poolse-features--cards .poolse-features__item, .poolse-cta--light, .poolse-contact__form) :is(h2, h3, h4) { color: var(--p-black); } .poolse-footer .poolse-event .poolse-event__title { color: var(--p-white); } /* Karty/kafelki w siatce wypełniają wysokość */ .e-con.poolse-grid > .elementor-widget, .poolse-fb-grid > .poolse-fb-widget { height: 100%; } .e-con.poolse-grid > .elementor-widget > .elementor-widget-container { height: 100%; } /* ---------- Hero ---------- */ .poolse-hero { --overlay: .55; position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; min-height: min(88vh, 860px); padding: clamp(120px, 16vw, 200px) var(--p-gutter) clamp(64px, 9vw, 112px); color: var(--p-white); background: var(--p-ink); } .poolse-hero--medium { min-height: min(68vh, 640px); } .poolse-hero--small { min-height: 0; padding-top: clamp(96px, 12vw, 150px); padding-bottom: clamp(56px, 7vw, 88px); } .poolse-hero__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; } .poolse-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(27, 27, 27, calc(var(--overlay) + .3)) 0%, rgba(27, 27, 27, var(--overlay)) 50%, rgba(27, 27, 27, calc(var(--overlay) * .35)) 100%), linear-gradient(0deg, rgba(27, 27, 27, .55) 0%, rgba(27, 27, 27, 0) 45%); } .poolse-hero--center { justify-content: center; text-align: center; } .poolse-hero--center::before { background: rgba(27, 27, 27, var(--overlay)); } .poolse-hero__inner { width: 100%; max-width: var(--p-container); margin: 0 auto; } .poolse-hero--center .poolse-hero__inner { max-width: 860px; } .poolse-hero--center .poolse-kicker { justify-content: center; } .poolse-hero__title { max-width: 15ch; margin: 0 0 22px; font-size: clamp(2.6rem, 6.2vw, 5.4rem); font-weight: 800; line-height: 1; letter-spacing: -.035em; color: var(--p-white); } .poolse-hero--medium .poolse-hero__title { font-size: clamp(2.3rem, 5vw, 4.4rem); max-width: 18ch; } .poolse-hero--small .poolse-hero__title { font-size: clamp(2.1rem, 4.4vw, 3.6rem); max-width: 22ch; } .poolse-hero--center .poolse-hero__title { margin-left: auto; margin-right: auto; } .poolse-hero__title em, .poolse-heading__title em, .poolse-cta__title em { font-style: normal; color: var(--p-red); } .poolse-hero__title em { color: var(--p-red); } .poolse-hero__text { max-width: 600px; font-size: clamp(1.05rem, 1.4vw, 1.2rem); color: rgba(255, 255, 255, .86); } .poolse-hero--center .poolse-hero__text { margin: 0 auto; } .poolse-hero__btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; } .poolse-hero--center .poolse-hero__btns { justify-content: center; } .poolse-hero__tags { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 0; padding: 0; list-style: none; } .poolse-hero__tags li { padding: 7px 14px; border-radius: 999px; font-size: 14px; font-weight: 600; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); } .poolse-hero__flag { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; } .poolse-hero__flag span, .poolse-footer__stripe span, .poolse-qr-footer__flag span { display: block; height: 5px; } .poolse-hero__flag span:first-child, .poolse-footer__stripe span:first-child, .poolse-qr-footer__flag span:first-child { background: var(--p-white); } .poolse-hero__flag span:last-child, .poolse-footer__stripe span:last-child, .poolse-qr-footer__flag span:last-child { background: var(--p-red); } /* ---------- Nagłówek sekcji ---------- */ .poolse-heading { max-width: 760px; } .poolse-heading--center { margin: 0 auto; text-align: center; } .poolse-heading--center .poolse-kicker { justify-content: center; } .poolse-heading__title { font-size: clamp(2rem, 3.6vw, 3.1rem); font-weight: 750; letter-spacing: -.025em; margin: 0; } h3.poolse-heading__title { font-size: clamp(1.4rem, 2.2vw, 1.9rem); } .poolse-heading__lead { margin-top: 18px; font-size: clamp(1.02rem, 1.3vw, 1.15rem); color: var(--p-grey); } .poolse-sec--dark .poolse-heading__lead, .poolse-sec--black .poolse-heading__lead { color: rgba(255, 255, 255, .72); } .poolse-sec--red .poolse-heading__lead { color: rgba(255, 255, 255, .9); } /* ---------- Karta usługi ---------- */ .poolse-service { position: relative; display: flex; flex-direction: column; height: 100%; background: var(--p-white); border-radius: var(--p-radius); overflow: hidden; box-shadow: var(--p-shadow); transition: transform .3s var(--p-ease), box-shadow .3s var(--p-ease); } .poolse-service.has-link:hover { transform: translateY(-6px); box-shadow: var(--p-shadow-lg); } .poolse-service__img { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--p-light); } .poolse-service__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--p-ease); } .poolse-service.has-link:hover .poolse-service__img img { transform: scale(1.05); } .poolse-service__badge { position: absolute; top: 16px; left: 16px; padding: 7px 14px; border-radius: 999px; background: var(--p-red); color: var(--p-white); font-family: var(--p-head); font-size: 14px; font-weight: 700; } .poolse-service__body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 26px 28px 30px; } .poolse-service__kicker { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--p-grey); } .poolse-service__title { margin: 0; font-size: 1.75rem; } .poolse-service__title a { color: inherit; text-decoration: none; } .poolse-service__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; } .poolse-service__text { color: var(--p-grey); font-size: 16px; flex: 1; } .poolse-service .poolse-link { margin-top: 6px; } /* ---------- Pakiety ---------- */ .poolse-package { position: relative; display: flex; flex-direction: column; height: 100%; background: var(--p-white); color: var(--p-graphite); border: 1px solid var(--p-line); border-radius: 24px; overflow: hidden; box-shadow: var(--p-shadow); transition: transform .3s var(--p-ease), box-shadow .3s var(--p-ease); } .poolse-package:hover { transform: translateY(-4px); box-shadow: var(--p-shadow-lg); } .poolse-package__img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; } .poolse-package__body { display: flex; flex-direction: column; flex: 1; padding: 34px 32px 32px; } .poolse-package__badge { align-self: flex-start; margin: -4px 0 14px; padding: 6px 12px; border-radius: 999px; background: var(--p-red); color: var(--p-white); font-family: var(--p-head); font-size: 12.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; } .poolse-package__title { margin: 0 0 4px; font-size: 1.55rem; color: var(--p-black); } .poolse-package__subtitle { margin: 0; color: var(--p-grey); font-size: 15px; } .poolse-package__price { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin: 22px 0 22px; padding-bottom: 22px; border-bottom: 1px dashed var(--p-line); } .poolse-package__price strong { font-family: var(--p-head); font-size: clamp(2.6rem, 4vw, 3.3rem); font-weight: 800; line-height: 1; letter-spacing: -.03em; color: var(--p-red); } .poolse-package__price span { color: var(--p-grey); font-weight: 600; } .poolse-package__list { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 11px; } .poolse-package__list li { display: flex; gap: 12px; align-items: flex-start; line-height: 1.45; } .poolse-package__list .poolse-icon { flex-shrink: 0; width: 22px; height: 22px; padding: 4px; margin-top: 1px; border-radius: 50%; background: var(--p-red-soft); color: var(--p-red); } .poolse-package__note { margin: auto 0 22px; padding: 10px 14px; border-radius: 10px; background: var(--p-light); font-size: 14.5px; font-weight: 600; } .poolse-package__btn { width: 100%; margin-top: auto; } .poolse-package__note + .poolse-package__btn { margin-top: 0; } .poolse-package.is-featured { background: var(--p-ink); border-color: var(--p-ink); color: rgba(255, 255, 255, .85); } .poolse-package.is-featured .poolse-package__title { color: var(--p-white); } .poolse-package.is-featured .poolse-package__subtitle, .poolse-package.is-featured .poolse-package__price span { color: rgba(255, 255, 255, .6); } .poolse-package.is-featured .poolse-package__price { border-color: rgba(255, 255, 255, .18); } .poolse-package.is-featured .poolse-package__price strong { color: var(--p-white); } .poolse-package.is-featured .poolse-package__list .poolse-icon { background: var(--p-red); color: var(--p-white); } .poolse-package.is-featured .poolse-package__note { background: rgba(255, 255, 255, .08); color: var(--p-white); } .poolse-package.is-featured .poolse-btn--red { box-shadow: none; } .poolse-sec--black .poolse-package:not(.is-featured), .poolse-sec--dark .poolse-package:not(.is-featured) { border-color: transparent; } .poolse-sec--black .poolse-package.is-featured { background: var(--p-graphite); border-color: var(--p-red); } /* ---------- Lista ---------- */ .poolse-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr)); gap: 12px 28px; } .poolse-list li { display: flex; align-items: flex-start; gap: 12px; line-height: 1.45; font-weight: 500; } .poolse-list--check .poolse-list__icon { flex-shrink: 0; display: grid; place-items: center; width: 26px; height: 26px; margin-top: -1px; border-radius: 50%; background: var(--p-red); color: var(--p-white); } .poolse-list--check .poolse-list__icon svg { width: 15px; height: 15px; stroke-width: 2.6; } .poolse-list--icon { gap: 12px; } .poolse-list--icon li { align-items: center; gap: 14px; min-height: 64px; padding: 12px 16px 12px 12px; border-radius: 16px; background: var(--p-white); border: 1px solid var(--p-line); font-family: var(--p-head); font-weight: 600; font-size: 16px; color: var(--p-black); transition: border-color .2s, transform .2s var(--p-ease); } .poolse-list--icon li:hover { border-color: var(--p-red); transform: translateY(-2px); } .poolse-list--icon .poolse-list__icon { flex-shrink: 0; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--p-red-soft); color: var(--p-red); } .poolse-list--icon .poolse-list__icon svg { width: 23px; height: 23px; } .poolse-sec--light .poolse-list--icon li { border-color: transparent; box-shadow: 0 1px 2px rgba(17,17,17,.05); } .poolse-sec--dark .poolse-list--icon li, .poolse-sec--black .poolse-list--icon li { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .1); color: var(--p-white); } .poolse-list--pills { display: flex; flex-wrap: wrap; gap: 10px; } .poolse-list--pills li { padding: 8px 16px; border-radius: 999px; border: 1.5px solid var(--p-black); font-family: var(--p-head); font-weight: 600; font-size: 15px; color: var(--p-black); } .poolse-list--pills li:nth-child(3n+1) { background: var(--p-black); color: var(--p-white); } .poolse-sec--dark .poolse-list--pills li, .poolse-sec--black .poolse-list--pills li { border-color: rgba(255, 255, 255, .5); color: var(--p-white); } @media (max-width: 767px) { .poolse-list { grid-template-columns: 1fr; } .poolse-list--icon { grid-template-columns: 1fr 1fr; } } @media (max-width: 440px) { .poolse-list--icon { grid-template-columns: 1fr; } } /* ---------- Pozycje / cennik ---------- */ .poolse-items__head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; } .poolse-items__head-icon { flex-shrink: 0; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--p-red); color: var(--p-white); } .poolse-items__head-icon svg { width: 28px; height: 28px; } .poolse-items__title { font-size: 1.35rem; margin: 0; } .poolse-items__subtitle { margin: 2px 0 0; font-size: 14.5px; color: var(--p-grey); } .poolse-items__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--cols, 1), minmax(0, 1fr)); gap: 0 48px; } .poolse-items--pricelist .poolse-items__item { padding: 14px 0; border-bottom: 1px solid var(--p-line); } .poolse-items--pricelist .poolse-items__item:last-child { border-bottom: 0; } .poolse-items__row { display: flex; align-items: baseline; gap: 12px; } .poolse-items__name { font-family: var(--p-head); font-weight: 600; font-size: 1.06rem; color: var(--p-black); } .poolse-items__dots { flex: 1; min-width: 20px; border-bottom: 2px dotted #D6D0C6; transform: translateY(-4px); } .poolse-items__price { font-family: var(--p-head); font-weight: 700; color: var(--p-red); white-space: nowrap; } .poolse-items__desc { margin: 4px 0 0; font-size: 14.5px; color: var(--p-grey); } .poolse-items__note { margin-top: 16px; font-size: 14px; color: var(--p-grey); font-style: italic; } .poolse-items--boxed { height: 100%; padding: 28px 30px 20px; border-radius: 24px; background: var(--p-white); box-shadow: var(--p-shadow); } .poolse-sec--white .poolse-items--boxed { border: 1px solid var(--p-line); box-shadow: none; } /* Kafelki z ikoną (np. „Menu dopasowane do uroczystości”) – równe bloki, ostatni rząd wyśrodkowany */ .poolse-items--groups .poolse-items__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; } .poolse-items--groups .poolse-items__item { --c: var(--cols, 4); flex: 0 0 calc((100% - (var(--c) - 1) * 20px) / var(--c)); display: flex; flex-direction: column; gap: 10px; min-height: 230px; padding: 26px 24px 24px; border-radius: 22px; background: var(--p-white); border: 1px solid var(--p-line); transition: transform .25s var(--p-ease), box-shadow .25s var(--p-ease), border-color .25s; } .poolse-items--groups .poolse-items__item:hover { transform: translateY(-4px); box-shadow: var(--p-shadow-lg); border-color: transparent; } .poolse-sec--light .poolse-items--groups .poolse-items__item { border-color: transparent; box-shadow: 0 1px 2px rgba(17,17,17,.05); } .poolse-items__icon { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 6px; border-radius: 18px; background: var(--p-red-soft); color: var(--p-red); transition: background .25s, color .25s; } .poolse-items__icon svg { width: 30px; height: 30px; } .poolse-items--groups .poolse-items__item:hover .poolse-items__icon { background: var(--p-red); color: var(--p-white); } .poolse-items--groups .poolse-items__name { font-size: 1.22rem; } .poolse-items--groups .poolse-items__desc { margin: 0; font-size: 15px; line-height: 1.55; color: var(--p-grey); } .poolse-items--groups .poolse-items__note { text-align: center; } .poolse-sec--dark .poolse-items--pricelist .poolse-items__item, .poolse-sec--black .poolse-items--pricelist .poolse-items__item { border-color: rgba(255, 255, 255, .12); } .poolse-sec--dark .poolse-items--pricelist:not(.poolse-items--boxed) .poolse-items__name, .poolse-sec--black .poolse-items--pricelist:not(.poolse-items--boxed) .poolse-items__name { color: var(--p-white); } .poolse-sec--dark .poolse-items--pricelist:not(.poolse-items--boxed) .poolse-items__price, .poolse-sec--black .poolse-items--pricelist:not(.poolse-items--boxed) .poolse-items__price { color: var(--p-red-on-dark); } @media (max-width: 1024px) { .poolse-items__list { grid-template-columns: repeat(min(var(--cols, 1), 2), minmax(0, 1fr)); } .poolse-items--groups .poolse-items__item { --c: 2; } } @media (max-width: 600px) { .poolse-items__list { grid-template-columns: 1fr; } .poolse-items--groups .poolse-items__item { --c: 1; min-height: 0; } .poolse-items--boxed { padding: 22px 20px 12px; } } /* ---------- Liczby / kroki ---------- */ .poolse-features { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 28px; } .poolse-features__value { display: block; font-family: var(--p-head); font-weight: 800; line-height: 1; letter-spacing: -.03em; color: var(--p-red); } .poolse-features__title { margin: 12px 0 6px; font-size: 1.2rem; } .poolse-features__text { margin: 0; font-size: 15.5px; color: var(--p-grey); } .poolse-sec--dark .poolse-features__text, .poolse-sec--black .poolse-features__text { color: rgba(255, 255, 255, .65); } .poolse-features--stats .poolse-features__item { padding-top: 22px; border-top: 2px solid var(--p-line); } .poolse-sec--dark .poolse-features--stats .poolse-features__item, .poolse-sec--black .poolse-features--stats .poolse-features__item { border-color: rgba(255, 255, 255, .16); } .poolse-features--stats .poolse-features__value { font-size: clamp(2.8rem, 5vw, 4.2rem); } .poolse-sec--dark .poolse-features--stats .poolse-features__value, .poolse-sec--black .poolse-features--stats .poolse-features__value { color: var(--p-white); } .poolse-sec--dark .poolse-features--stats .poolse-features__item:nth-child(odd) .poolse-features__value { color: var(--p-red-on-dark); } .poolse-features--steps { counter-reset: step; } .poolse-features--steps .poolse-features__item { position: relative; padding: 28px 26px; border-radius: 20px; background: var(--p-light); } .poolse-sec--light .poolse-features--steps .poolse-features__item { background: var(--p-white); } .poolse-sec--dark .poolse-features--steps .poolse-features__item, .poolse-sec--black .poolse-features--steps .poolse-features__item { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); } .poolse-features--steps .poolse-features__value { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--p-red); color: var(--p-white) !important; font-size: 1.4rem; } .poolse-features--cards .poolse-features__item { padding: 28px; border-radius: 20px; background: var(--p-white); box-shadow: var(--p-shadow); } .poolse-features--cards .poolse-features__value { font-size: 2.2rem; } .poolse-features__icon { position: relative; display: inline-grid; place-items: center; width: 60px; height: 60px; border-radius: 18px; background: var(--p-red); color: var(--p-white); } .poolse-features__icon svg { width: 32px; height: 32px; } .poolse-features__icon b { position: absolute; top: -8px; right: -8px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--p-white); color: var(--p-black); font-family: var(--p-head); font-size: 13px; box-shadow: 0 2px 6px rgba(0,0,0,.2); } .poolse-features--stats .poolse-features__icon { background: var(--p-red-soft); color: var(--p-red); } @media (max-width: 1024px) { .poolse-features { grid-template-columns: repeat(min(var(--cols, 3), 2), minmax(0, 1fr)); } } @media (max-width: 560px) { .poolse-features { grid-template-columns: 1fr; } .poolse-features--stats { grid-template-columns: 1fr 1fr; gap: 24px 18px; } } /* ---------- Zdjęcia z plakietką ---------- */ .poolse-media { position: relative; } .poolse-media--duo { padding-bottom: 12%; padding-left: 10%; } .poolse-media__main img { width: 100%; height: auto; max-height: 620px; object-fit: cover; border-radius: 26px; box-shadow: var(--p-shadow-lg); } .poolse-media--landscape .poolse-media__main img { aspect-ratio: 4 / 3; height: auto; } .poolse-media--portrait .poolse-media__main img { aspect-ratio: 4 / 5; height: auto; } .poolse-media--square .poolse-media__main img { aspect-ratio: 1; height: auto; } .poolse-media__second { position: absolute; left: 0; bottom: 0; width: 42%; } .poolse-media__second img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 20px; border: 8px solid var(--p-white); box-shadow: var(--p-shadow-lg); } .poolse-sec--light .poolse-media__second img { border-color: var(--p-light); } .poolse-sec--dark .poolse-media__second img { border-color: var(--p-ink); } .poolse-sec--black .poolse-media__second img { border-color: var(--p-ink); } .poolse-media__badge { position: absolute; top: 24px; right: -14px; display: flex; flex-direction: column; gap: 2px; max-width: 200px; padding: 16px 20px; border-radius: 16px; background: var(--p-red); color: var(--p-white); box-shadow: 0 18px 40px -16px rgba(214, 28, 29, .8); transform: rotate(-3deg); } .poolse-media__badge strong { font-family: var(--p-head); font-size: 1.7rem; font-weight: 800; line-height: 1.05; } .poolse-media__badge span { font-size: 13.5px; line-height: 1.3; font-weight: 600; opacity: .92; } @media (max-width: 767px) { .poolse-media__badge { right: 8px; top: 12px; } .poolse-media__main img { max-height: 460px; } } /* ---------- Galeria ---------- */ .poolse-gallery { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 14px; } .poolse-gallery__item { position: relative; display: block; overflow: hidden; border-radius: 16px; background: var(--p-light); aspect-ratio: 1; } .poolse-gallery__item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--p-ease); } .poolse-gallery__item:hover img { transform: scale(1.06); } .poolse-gallery--mosaic { grid-auto-rows: clamp(150px, 17vw, 240px); grid-auto-flow: dense; } .poolse-gallery--mosaic .poolse-gallery__item { aspect-ratio: auto; } .poolse-gallery--mosaic .poolse-gallery__item:nth-child(8n+1) { grid-column: span 2; grid-row: span 2; } .poolse-gallery--mosaic .poolse-gallery__item:nth-child(8n+6) { grid-column: span 2; } @media (max-width: 767px) { .poolse-gallery { grid-template-columns: repeat(2, 1fr); gap: 10px; } .poolse-gallery--mosaic { grid-auto-rows: 140px; } .poolse-gallery--mosaic .poolse-gallery__item:nth-child(8n+6) { grid-column: auto; } .poolse-gallery--mosaic .poolse-gallery__item:nth-child(8n+8) { grid-column: span 2; } } /* ---------- Baner CTA ---------- */ .poolse-cta { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 28px 48px; padding: clamp(36px, 5.5vw, 72px); border-radius: 30px; background: var(--p-ink); color: rgba(255, 255, 255, .85); } .poolse-cta--red { background: var(--p-red); color: rgba(255, 255, 255, .92); } .poolse-cta--light { background: var(--p-light); color: var(--p-graphite); } .poolse-sec--light .poolse-cta--light { background: var(--p-white); } .poolse-cta__ornament { position: absolute; z-index: -1; right: -70px; top: -70px; width: 320px; height: 320px; background: currentColor; opacity: .1; -webkit-mask: url("../img/wycinanka.svg") center / contain no-repeat; mask: url("../img/wycinanka.svg") center / contain no-repeat; animation: poolse-spin 60s linear infinite; } .poolse-cta--dark .poolse-cta__ornament { background: var(--p-red); opacity: .35; } .poolse-cta--light .poolse-cta__ornament { background: var(--p-red); opacity: .14; } @keyframes poolse-spin { to { transform: rotate(360deg); } } @media (prefers-reduced-motion: reduce) { .poolse-cta__ornament { animation: none; } html { scroll-behavior: auto; } } .poolse-cta__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; } .poolse-cta.has-bg::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(27, 27, 27, .7); } .poolse-cta__badge { display: inline-block; margin-bottom: 14px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, .16); color: var(--p-white); font-family: var(--p-head); font-weight: 700; font-size: 14px; } .poolse-cta--dark .poolse-cta__badge { background: var(--p-red); } .poolse-cta--light .poolse-cta__badge { background: var(--p-red); } .poolse-cta__title { margin: 0; font-size: clamp(1.8rem, 3.4vw, 2.8rem); font-weight: 800; letter-spacing: -.025em; color: var(--p-white); max-width: 22ch; } .poolse-cta--light .poolse-cta__title { color: var(--p-black); } .poolse-cta__text { margin-top: 14px; max-width: 640px; font-size: 1.05rem; } .poolse-cta__btns { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; } .poolse-cta--light .poolse-btn--outline-light { color: var(--p-black); border-color: var(--p-line); } @media (max-width: 860px) { .poolse-cta { grid-template-columns: 1fr; } .poolse-cta__btns { justify-content: flex-start; } } /* ---------- Dania ---------- */ .poolse-dishes { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: 24px; } .poolse-dish { display: flex; flex-direction: column; overflow: hidden; background: var(--p-white); border: 1px solid var(--p-line); border-radius: var(--p-radius); transition: transform .3s var(--p-ease), box-shadow .3s var(--p-ease); } .poolse-dish:hover { transform: translateY(-4px); box-shadow: var(--p-shadow-lg); } .poolse-sec--light .poolse-dish { border-color: transparent; box-shadow: var(--p-shadow); } .poolse-dish__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--p-graphite); } .poolse-dish__img img { width: 100%; height: 100%; object-fit: cover; } .poolse-dish__placeholder { position: relative; display: grid; place-items: center; width: 100%; height: 100%; font-family: var(--p-head); font-size: 4.5rem; font-weight: 800; color: rgba(255, 255, 255, .92); background: radial-gradient(circle at 80% 20%, rgba(214, 28, 29, .55), transparent 55%), linear-gradient(135deg, var(--p-graphite), var(--p-ink)); } .poolse-dish__placeholder::after { content: ""; position: absolute; right: -30px; bottom: -30px; width: 140px; height: 140px; background: var(--p-red); opacity: .55; -webkit-mask: url("../img/wycinanka.svg") center / contain no-repeat; mask: url("../img/wycinanka.svg") center / contain no-repeat; } .poolse-dish__body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 22px 24px 24px; } .poolse-dish__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .poolse-dish__name { margin: 0; font-size: 1.3rem; } .poolse-dish__name a { color: var(--p-black); text-decoration: none; } .poolse-dish__name a:hover { color: var(--p-red); } .poolse-dish__price { font-family: var(--p-head); font-weight: 700; color: var(--p-red); white-space: nowrap; } .poolse-dish__badges, .poolse-qr-dish__tags { display: flex; flex-wrap: wrap; gap: 6px; } .poolse-badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; background: var(--p-graphite); color: var(--p-white); } .poolse-badge--spicy { background: var(--p-red); } .poolse-badge--vegan, .poolse-badge--vegetarian { background: var(--p-white); color: var(--p-black); border: 1.5px solid var(--p-black); } .poolse-dish__desc { margin: 0; color: var(--p-grey); font-size: 15px; line-height: 1.55; flex: 1; } .poolse-dish__allergens { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; } .poolse-dish__allergens li { padding: 3px 9px; border-radius: 6px; background: var(--p-light); font-size: 12.5px; font-weight: 600; color: var(--p-graphite); } .poolse-dish__more { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; margin-top: 4px; padding: 9px 14px; border-radius: 999px; background: var(--p-red-soft); color: var(--p-red); font-family: var(--p-head); font-weight: 600; font-size: 14.5px; text-decoration: none; } .poolse-dish__more:hover { background: var(--p-red); color: var(--p-white); } .poolse-dish__more .poolse-icon { width: 18px; height: 18px; } @media (max-width: 1024px) { .poolse-dishes { grid-template-columns: repeat(min(var(--cols, 3), 2), minmax(0, 1fr)); } } @media (max-width: 640px) { .poolse-dishes { grid-template-columns: 1fr; } } .poolse-dishes[style*="--cols:1"] .poolse-dish { flex-direction: row; } .poolse-dishes[style*="--cols:1"] .poolse-dish__img { flex: 0 0 112px; aspect-ratio: auto; } .poolse-dishes[style*="--cols:1"] .poolse-dish__placeholder { font-size: 2.6rem; } .poolse-dishes[style*="--cols:1"] .poolse-dish__body { padding: 16px 18px; gap: 6px; } .poolse-dishes[style*="--cols:1"] .poolse-dish__name { font-size: 1.12rem; } .poolse-dishes[style*="--cols:1"] .poolse-dish:hover { transform: none; } .poolse-empty { padding: 28px; border: 2px dashed var(--p-line); border-radius: 16px; text-align: center; color: var(--p-grey); } /* ---------- Terminy ---------- */ .poolse-events { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; } .poolse-event { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; align-items: center; gap: 22px; padding: 16px 20px 16px 16px; border-radius: 18px; background: var(--p-white); border: 1px solid var(--p-line); transition: border-color .2s, box-shadow .2s; } .poolse-sec--light .poolse-event { border-color: transparent; box-shadow: var(--p-shadow); } .poolse-event:hover { border-color: var(--p-red); } .poolse-event__date { display: flex; flex-direction: column; align-items: center; justify-content: center; aspect-ratio: 1; border-radius: 14px; background: var(--p-red); color: var(--p-white); text-align: center; } .poolse-event__day { font-family: var(--p-head); font-size: 1.85rem; font-weight: 800; line-height: 1; } .poolse-event__month { margin-top: 4px; font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; } .poolse-event__title { margin: 0 0 4px; font-size: 1.18rem; } .poolse-event__meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0; font-size: 14.5px; color: var(--p-grey); } .poolse-event__meta span { display: inline-flex; align-items: center; gap: 5px; } .poolse-event__meta .poolse-icon { width: 16px; height: 16px; color: var(--p-red); } .poolse-event__desc { margin: 6px 0 0; font-size: 14.5px; } .poolse-event__map { display: inline-flex; align-items: center; gap: 4px; font-family: var(--p-head); font-weight: 600; font-size: 14.5px; text-decoration: none; } .poolse-event__map .poolse-icon { width: 16px; height: 16px; } .poolse-events__empty { margin: 0; padding: 28px 28px 28px 84px; position: relative; border-radius: 18px; border: 2px dashed rgba(214, 28, 29, .35); color: var(--p-graphite); font-weight: 500; background: rgba(255, 255, 255, .6); } .poolse-events__empty::before { content: ""; position: absolute; left: 26px; top: 50%; width: 38px; height: 38px; transform: translateY(-50%); background: var(--p-red); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 5h12v3h4l4 4v5h-2a3 3 0 0 1-6 0H9a3 3 0 0 1-6 0H2zm12 5v3h6l-2.6-3zM6 16a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm11 0a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 5h12v3h4l4 4v5h-2a3 3 0 0 1-6 0H9a3 3 0 0 1-6 0H2zm12 5v3h6l-2.6-3zM6 16a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm11 0a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3E%3C/svg%3E") center / contain no-repeat; } @media (max-width: 560px) { .poolse-event { grid-template-columns: 64px minmax(0, 1fr); gap: 14px; } .poolse-event__day { font-size: 1.4rem; } .poolse-event__map { grid-column: 2; } .poolse-events__empty { padding: 72px 22px 22px; } .poolse-events__empty::before { top: 22px; left: 22px; transform: none; } } /* ---------- Kontakt + formularz ---------- */ .poolse-contact { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 72px); align-items: start; } .poolse-contact__title { font-size: clamp(1.9rem, 3.2vw, 2.7rem); } .poolse-contact__info > p { color: var(--p-grey); font-size: 1.08rem; } .poolse-contact-list { list-style: none; margin: 28px 0; padding: 0; display: grid; gap: 14px; } .poolse-contact-list li { display: flex; align-items: center; gap: 14px; font-weight: 600; } .poolse-contact-list .poolse-icon { flex-shrink: 0; width: 44px; height: 44px; padding: 11px; border-radius: 50%; background: var(--p-red-soft); color: var(--p-red); } .poolse-contact-list a { color: var(--p-black); text-decoration: none; } .poolse-contact-list a:hover { color: var(--p-red); } .poolse-contact__form { padding: clamp(24px, 4vw, 44px); border-radius: 26px; background: var(--p-light); } @media (max-width: 900px) { .poolse-contact { grid-template-columns: 1fr; } } .poolse-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; } .poolse-form label { display: flex; flex-direction: column; gap: 7px; } .poolse-form label > span { font-family: var(--p-head); font-weight: 600; font-size: 14.5px; color: var(--p-black); } .poolse-form__full { grid-column: 1 / -1; } .poolse-form input[type="text"], .poolse-form input[type="email"], .poolse-form input[type="tel"], .poolse-form input[type="date"], .poolse-form input[type="number"], .poolse-form select, .poolse-form textarea { width: 100%; padding: 13px 15px; font: inherit; font-size: 16px; color: var(--p-black); background: var(--p-white); border: 1.5px solid var(--p-line); border-radius: 12px; transition: border-color .2s, box-shadow .2s; -webkit-appearance: none; appearance: none; } .poolse-form select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%231b1b1b'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 22px; padding-right: 40px; } .poolse-form input:focus, .poolse-form select:focus, .poolse-form textarea:focus { outline: none; border-color: var(--p-red); box-shadow: 0 0 0 4px rgba(214, 28, 29, .14); } .poolse-form textarea { resize: vertical; min-height: 130px; } .poolse-form__consent { flex-direction: row !important; align-items: flex-start; gap: 10px !important; margin: 18px 0 22px; font-size: 14px; color: var(--p-grey); } .poolse-form__consent input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--p-red); flex-shrink: 0; } .poolse-form__consent span { font-family: var(--p-body) !important; font-weight: 500 !important; color: var(--p-grey) !important; } .poolse-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; } .poolse-form button { width: 100%; } @media (max-width: 560px) { .poolse-form__grid { grid-template-columns: 1fr; } } .poolse-alert { margin-bottom: 18px; padding: 14px 18px; border-radius: 12px; font-weight: 600; } .poolse-alert--ok { background: var(--p-light); color: var(--p-ink); } .poolse-alert--err { background: var(--p-red-soft); color: var(--p-red-dark); } /* ---------- Social ---------- */ .poolse-social { display: inline-flex; gap: 8px; } .poolse-social a { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--p-light); color: var(--p-black); transition: .2s; } .poolse-social a:hover { background: var(--p-red); color: var(--p-white); } .poolse-social .poolse-icon { width: 19px; height: 19px; } .poolse-topbar .poolse-social a { width: auto; height: auto; background: none; color: var(--p-white); } /* ---------- Stopka ---------- */ .poolse-footer { position: relative; background: var(--p-ink); color: rgba(255, 255, 255, .7); font-size: 15.5px; } .poolse-footer__stripe { display: flex; flex-direction: column; } .poolse-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1.1fr 1.3fr; gap: 48px; padding-top: 72px; padding-bottom: 56px; } .poolse-footer__about .poolse-logo img { height: 92px; margin: -8px 0 18px -6px; } .poolse-footer__about p { max-width: 360px; } .poolse-footer__about .poolse-social { margin-top: 18px; } .poolse-footer .poolse-social a { background: rgba(255, 255, 255, .08); color: var(--p-white); } .poolse-footer .poolse-social a:hover { background: var(--p-red); } .poolse-footer__title { margin: 0 0 18px; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--p-white); font-weight: 700; } .poolse-footer__menu, .poolse-footer .poolse-menu { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; } .poolse-footer .poolse-menu { flex-direction: column; align-items: flex-start; } .poolse-footer a { color: rgba(255, 255, 255, .78); text-decoration: none; } .poolse-footer a:hover { color: var(--p-white); } .poolse-footer .poolse-menu a { padding: 0; font-family: var(--p-body); font-weight: 500; font-size: 15.5px; color: rgba(255, 255, 255, .78); background: none !important; } .poolse-footer .poolse-contact-list { margin: 0; gap: 12px; } .poolse-footer .poolse-contact-list li { font-weight: 500; } .poolse-footer .poolse-contact-list .poolse-icon { width: 36px; height: 36px; padding: 9px; background: rgba(255, 255, 255, .08); color: var(--p-red-on-dark); } .poolse-footer .poolse-contact-list a { color: rgba(255, 255, 255, .85); } .poolse-footer .poolse-events { gap: 10px; } .poolse-footer .poolse-event { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 0; background: none; border: 0; box-shadow: none; } .poolse-footer .poolse-event__day { font-size: 1.15rem; } .poolse-footer .poolse-event__month { font-size: 10.5px; } .poolse-footer .poolse-event__title { color: var(--p-white); font-size: 15px; } .poolse-footer .poolse-event__meta { font-size: 13px; color: rgba(255, 255, 255, .55); } .poolse-footer .poolse-event__map, .poolse-footer .poolse-event__desc { display: none; } .poolse-footer .poolse-events__empty { padding: 0; border: 0; background: none; color: rgba(255, 255, 255, .7); } .poolse-footer .poolse-events__empty::before { display: none; } .poolse-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); font-size: 14px; } .poolse-footer__bottom-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; padding-top: 22px; padding-bottom: 22px; } .poolse-footer__bottom p { margin: 0; } .poolse-footer__tagline { color: rgba(255, 255, 255, .5); } .poolse-footer__legal { display: flex; gap: 18px; list-style: none; margin: 0; padding: 0; } @media (max-width: 1024px) { .poolse-footer__grid { grid-template-columns: 1fr 1fr; } } @media (max-width: 600px) { .poolse-footer__grid { grid-template-columns: 1fr; gap: 36px; padding-top: 56px; } } /* ---------- Podstrony bez Elementora / blog ---------- */ .poolse-page-hero { position: relative; overflow: hidden; isolation: isolate; padding: clamp(72px, 10vw, 128px) 0 clamp(56px, 7vw, 88px); background: var(--p-ink); color: rgba(251, 248, 243, .78); } .poolse-page-hero::after { content: ""; position: absolute; z-index: -1; right: -90px; top: -90px; width: 380px; height: 380px; background: var(--p-red); opacity: .32; -webkit-mask: url("../img/wycinanka.svg") center / contain no-repeat; mask: url("../img/wycinanka.svg") center / contain no-repeat; } .poolse-page-hero .poolse-kicker { color: var(--p-red-on-dark); } .poolse-page-hero__title { margin: 0; color: var(--p-white); font-size: clamp(2.3rem, 5vw, 4rem); font-weight: 800; letter-spacing: -.03em; max-width: 20ch; } .poolse-page-hero__title span { color: var(--p-red-on-dark); } .poolse-page-hero__lead { max-width: 640px; margin-top: 18px; font-size: 1.12rem; } .poolse-page-hero--post .poolse-page-hero__title { font-size: clamp(2rem, 4.2vw, 3.3rem); max-width: none; } .poolse-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; } .poolse-card { position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: var(--p-radius); background: var(--p-white); box-shadow: var(--p-shadow); transition: transform .3s var(--p-ease), box-shadow .3s var(--p-ease); } .poolse-card:hover { transform: translateY(-5px); box-shadow: var(--p-shadow-lg); } .poolse-card__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--p-graphite); } .poolse-card__img img { width: 100%; height: 100%; object-fit: cover; } .poolse-card__placeholder { display: grid; place-items: center; height: 100%; color: var(--p-red); } .poolse-card__placeholder .poolse-icon { width: 64px; height: 64px; } .poolse-card__body { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 24px 26px 28px; } .poolse-card__meta { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--p-grey); text-transform: uppercase; letter-spacing: .06em; } .poolse-card__meta span { color: var(--p-red); } .poolse-card__title { margin: 0; font-size: 1.4rem; } .poolse-card__title a { color: var(--p-black); text-decoration: none; } .poolse-card__title a::after { content: ""; position: absolute; inset: 0; } .poolse-card__excerpt { margin: 0; color: var(--p-grey); font-size: 15.5px; flex: 1; } @media (max-width: 1024px) { .poolse-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 640px) { .poolse-cards { grid-template-columns: 1fr; } } .nav-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 56px; } .nav-links .page-numbers { display: inline-grid; place-items: center; min-width: 46px; height: 46px; padding: 0 14px; border-radius: 999px; background: var(--p-light); color: var(--p-black); font-family: var(--p-head); font-weight: 600; text-decoration: none; } .nav-links .page-numbers.current, .nav-links .page-numbers:hover { background: var(--p-red); color: var(--p-white); } .poolse-single__img { margin-top: -40px; margin-bottom: 0; position: relative; } .poolse-single__img img { width: 100%; max-height: 620px; object-fit: cover; border-radius: 26px; box-shadow: var(--p-shadow-lg); } .poolse-prose { font-size: 18px; line-height: 1.75; } .poolse-prose > * + * { margin-top: 1.1em; } .poolse-prose h2 { font-size: 1.9rem; margin-top: 1.8em; } .poolse-prose h3 { font-size: 1.45rem; margin-top: 1.6em; } .poolse-prose ul, .poolse-prose ol { padding-left: 1.3em; } .poolse-prose li::marker { color: var(--p-red); } .poolse-prose blockquote { margin: 1.6em 0; padding: 4px 0 4px 24px; border-left: 4px solid var(--p-red); font-family: var(--p-head); font-size: 1.35rem; color: var(--p-black); } .poolse-prose img { border-radius: 16px; } .poolse-prose .wp-block-image figcaption { font-size: 14px; color: var(--p-grey); text-align: center; } .elementor-widget-text-editor p:last-child { margin-bottom: 0; } .poolse-post-nav .nav-links { justify-content: space-between; margin: 48px auto 72px; } .poolse-post-nav .nav-links a { display: flex; flex-direction: column; gap: 4px; max-width: 46%; padding: 18px 22px; border-radius: 16px; background: var(--p-light); color: var(--p-black); text-decoration: none; font-family: var(--p-head); font-weight: 600; } .poolse-post-nav .nav-links a span { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--p-red); } .poolse-post-nav .nav-next { margin-left: auto; text-align: right; } .poolse-404 { padding: clamp(80px, 12vw, 160px) 0; text-align: center; } .poolse-404__code { margin: 0; font-family: var(--p-head); font-size: clamp(6rem, 18vw, 12rem); font-weight: 800; line-height: 1; color: var(--p-red); letter-spacing: -.05em; } .poolse-404 h1 { font-size: clamp(1.8rem, 3.6vw, 2.8rem); } .poolse-404 p { color: var(--p-grey); margin-bottom: 32px; } /* Komentarze (podstawowe) */ .comment-respond, .comments-area { margin: 48px 0; } .comment-form input:not([type="submit"]):not([type="checkbox"]), .comment-form textarea { width: 100%; padding: 12px 14px; border: 1.5px solid var(--p-line); border-radius: 12px; font: inherit; } .comment-form .submit { padding: 14px 26px; border: 0; border-radius: 999px; background: var(--p-red); color: var(--p-white); font-family: var(--p-head); font-weight: 600; cursor: pointer; } /* ========================================================================= Strony QR (danie / menu) – lekkie, mobilne ========================================================================= */ .poolse-qr-body { background: var(--p-light); font-size: 17px; } .poolse-qr-header { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px max(16px, env(safe-area-inset-left)) 10px 16px; background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--p-line); } .admin-bar .poolse-qr-header { top: 32px; } @media (max-width: 782px) { .admin-bar .poolse-qr-header { top: 46px; } } .poolse-qr-header__logo img { height: 46px; width: auto; } .poolse-lang { display: inline-flex; padding: 4px; gap: 2px; border-radius: 999px; background: var(--p-light); } .poolse-lang__btn { display: inline-flex; align-items: center; gap: 5px; padding: 8px 12px; border-radius: 999px; font-family: var(--p-head); font-weight: 700; font-size: 14px; color: var(--p-graphite); text-decoration: none; transition: .15s; } .poolse-lang__flag { font-size: 16px; line-height: 1; } .poolse-lang__btn.is-active { background: var(--p-ink); color: var(--p-white); box-shadow: 0 4px 12px -4px rgba(0, 0, 0, .4); } @media (max-width: 360px) { .poolse-lang__btn { padding: 8px 9px; } } .poolse-qr-main { max-width: 680px; margin: 0 auto; padding-bottom: 32px; } .poolse-qr-dish__img { margin: 0; } .poolse-qr-dish__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; } .poolse-qr-dish__panel { padding: 0 16px; } .poolse-qr-dish__card { position: relative; margin-top: 16px; padding: 26px 22px 24px; border-radius: 24px; background: var(--p-ink); color: rgba(255, 255, 255, .85); overflow: hidden; isolation: isolate; } .poolse-qr-dish__img + .poolse-qr-dish__panel .poolse-qr-dish__card { margin-top: -48px; } .poolse-qr-dish__card::after { content: ""; position: absolute; z-index: -1; right: -50px; top: -50px; width: 170px; height: 170px; background: var(--p-red); opacity: .45; -webkit-mask: url("../img/wycinanka.svg") center / contain no-repeat; mask: url("../img/wycinanka.svg") center / contain no-repeat; } .poolse-qr-dish__name { margin: 0; color: var(--p-white); font-size: clamp(1.9rem, 7vw, 2.6rem); font-weight: 800; letter-spacing: -.025em; padding-right: 30px; } .poolse-qr-dish__original { margin: 4px 0 0; font-size: 15px; font-style: italic; color: rgba(255, 255, 255, .55); } .poolse-qr-dish__tags { margin-top: 14px; align-items: center; } .poolse-qr-dish__card .poolse-badge { background: rgba(255, 255, 255, .14); color: var(--p-white); border: 0; } .poolse-qr-dish__card .poolse-badge--spicy { background: var(--p-red); } .poolse-qr-dish__price { margin-left: auto; font-family: var(--p-head); font-size: 1.3rem; font-weight: 800; color: var(--p-white); } .poolse-qr-dish__desc { margin: 16px 0 0; font-size: 16.5px; line-height: 1.6; } .poolse-qr-block { margin-top: 14px; padding: 22px; border-radius: 20px; background: var(--p-white); } .poolse-qr-block h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--p-red); } .poolse-qr-block h2::before { content: ""; width: 22px; height: 2px; background: currentColor; } .poolse-qr-block h3 { margin: 16px 0 10px; font-size: 15px; color: var(--p-black); } .poolse-qr-block h3:first-of-type { margin-top: 0; } .poolse-qr-dish__ingr { margin: 0; line-height: 1.7; } .poolse-allergen-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; list-style: none; } .poolse-allergen-grid li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--p-red-soft); color: var(--p-black); font-weight: 700; font-size: 15px; line-height: 1.25; } .poolse-allergen-grid__icon { font-size: 22px; line-height: 1; } .poolse-qr-traces { margin: 0; color: var(--p-graphite); } .poolse-qr-none { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 700; color: var(--p-ink); } .poolse-qr-none .poolse-icon { width: 22px; height: 22px; } .poolse-qr-pending { margin: 0; padding: 14px 16px; border-radius: 12px; background: var(--p-light); border-left: 4px solid var(--p-red); font-weight: 600; color: var(--p-black); } .poolse-qr-ask { margin: 14px 16px 0; padding: 14px 16px; border-radius: 14px; background: var(--p-ink); color: var(--p-white); font-size: 14.5px; font-weight: 600; } .poolse-qr-dish__panel .poolse-qr-ask { margin: 14px 0 0; } .poolse-qr-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; } .poolse-qr-actions .poolse-btn { padding: 14px 12px; font-size: 15px; text-align: center; } .poolse-qr-updated { margin: 14px 0 0; text-align: center; font-size: 13px; color: var(--p-grey); } .poolse-qr-menu { padding: 26px 16px 8px; } .poolse-qr-menu__title { margin: 0; font-size: clamp(2rem, 8vw, 2.8rem); font-weight: 800; letter-spacing: -.03em; } .poolse-qr-menu__lead { color: var(--p-grey); margin-top: 6px; } .poolse-qr-menu__group { margin-top: 26px; } .poolse-qr-menu__group > h2 { margin: 0 0 12px; font-size: 1.25rem; display: flex; align-items: center; gap: 10px; } .poolse-qr-menu__group > h2::before { content: ""; width: 8px; height: 22px; border-radius: 3px; background: var(--p-red); } .poolse-qr-menu .poolse-dishes { gap: 12px; } .poolse-qr-menu .poolse-dish { border: 0; } .poolse-qr-menu .poolse-dish__more { padding: 0; background: none; font-size: 14px; } .poolse-qr-menu .poolse-dish__more:hover { background: none; color: var(--p-red-dark); } .poolse-qr-menu .poolse-qr-ask { margin: 24px 0 0; } .poolse-qr-footer { padding: 0 16px 32px; text-align: center; font-size: 14px; color: var(--p-grey); } .poolse-qr-footer__flag { display: flex; flex-direction: column; width: 56px; margin: 8px auto 16px; border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 1px var(--p-line); } .poolse-qr-footer p { margin: 0 0 4px; } /* Legenda alergenów */ .poolse-allergen-legend { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px 20px; padding-left: 1.4em; } .poolse-allergen-legend li::marker { color: var(--p-red); font-weight: 700; } /* Edytor Elementora: puste widżety */ .elementor-editor-active .poolse-gallery:empty { min-height: 120px; border: 2px dashed var(--p-line); border-radius: 16px; } /* Lightbox Elementora – zaokrąglenia */ .elementor-lightbox .elementor-lightbox-image { border-radius: 12px; } @media print { .poolse-topbar, .poolse-header, .poolse-footer, .poolse-qr-header, .poolse-lang { display: none !important; } } /* ========================================================================= Przełącznik języka ========================================================================= */ /* Pakiet – ikona + plakietka */ .poolse-package__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -4px 0 18px; } .poolse-package__top .poolse-package__badge { margin: 0 0 0 auto; } .poolse-package__icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 16px; background: var(--p-red-soft); color: var(--p-red); } .poolse-package__icon svg { width: 28px; height: 28px; } .poolse-package.is-featured .poolse-package__icon { background: var(--p-red); color: var(--p-white); } /* CTA – ikona w plakietce */ .poolse-cta__badge { display: inline-flex; align-items: center; gap: 8px; } .poolse-cta__badge svg { width: 18px; height: 18px; } /* Legenda alergenów */ .poolse-allergen-legend span svg { width: 20px; height: 20px; color: var(--p-red); vertical-align: -4px; } .poolse-allergen-grid__icon svg { width: 26px; height: 26px; color: var(--p-red); display: block; } /* ========================================================================= Mapa ========================================================================= */ .poolse-map { display: flex; flex-direction: column; gap: 14px; } .poolse-map__frame { position: relative; height: var(--h, 440px); overflow: hidden; border-radius: 26px; background: var(--p-graphite); isolation: isolate; } .poolse-map__frame::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .25; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 44px 44px; } .poolse-map__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .poolse-map__placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px; text-align: center; color: var(--p-white); } .poolse-map__pin { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--p-red); color: var(--p-white); box-shadow: 0 0 0 12px rgba(214, 28, 29, .2); } .poolse-map__pin svg { width: 36px; height: 36px; } .poolse-map__addr { margin: 8px 0 0; font-family: var(--p-head); font-size: 1.3rem; font-weight: 700; color: var(--p-white); } .poolse-map__note { margin: 0; max-width: 420px; font-size: 13px; color: rgba(255, 255, 255, .6); } .poolse-map__open { align-self: flex-start; } /* ========================================================================= Odporność na ustawienia globalne Elementora / innych motywów (np. czcionka nagłówków lub ich kolor ustawiony w „Ustawieniach witryny”) ========================================================================= */ html body :is(.poolse-sec, .poolse-hero, .poolse-footer, .poolse-page-hero, .poolse-section, .poolse-qr-main, .poolse-topbar, .poolse-header, .poolse-404) { font-family: var(--p-body); } html body :is(.poolse-sec, .poolse-hero, .poolse-footer, .poolse-page-hero, .poolse-section, .poolse-qr-main, .poolse-header, .poolse-404) :is(h1, h2, h3, h4, h5, h6) { font-family: var(--p-head); text-transform: none; font-style: normal; letter-spacing: -.015em; } html body .poolse-sec :is(h1, h2, h3, h4, h5, h6), html body .poolse-section :is(h1, h2, h3, h4) { color: var(--p-black); } html body :is(.poolse-sec--dark, .poolse-sec--black, .poolse-sec--red, .poolse-hero, .poolse-page-hero, .poolse-footer) :is(h1, h2, h3, h4, h5, h6) { color: var(--p-white); } html body .poolse-sec :is(.poolse-package:not(.is-featured), .poolse-service, .poolse-dish, .poolse-event, .poolse-card, .poolse-features--cards .poolse-features__item, .poolse-cta--light, .poolse-contact__form, .poolse-items--boxed, .poolse-items--groups .poolse-items__item) :is(h2, h3, h4) { color: var(--p-black); } html body .poolse-sec .poolse-package.is-featured :is(h2, h3), html body .poolse-sec .poolse-cta:not(.poolse-cta--light) .poolse-cta__title { color: var(--p-white); } html body .poolse-hero .poolse-hero__title { font-weight: 800; letter-spacing: -.035em; line-height: 1; } html body .poolse-heading .poolse-heading__title { font-weight: 750; letter-spacing: -.025em; line-height: 1.1; } html body .poolse-sec :is(.poolse-heading__title, .poolse-hero__title, .poolse-cta__title) em { color: var(--p-red); font-style: normal; } html body .poolse-hero .poolse-hero__title em { color: var(--p-red); } html body .poolse-sec--dark .poolse-heading__title em, html body .poolse-sec--black .poolse-heading__title em { color: var(--p-red-on-dark); } html body .poolse-sec :is(p, li, label, input, textarea, select, button) { font-family: inherit; } html body .poolse-sec .poolse-btn, html body .poolse-header .poolse-btn { font-family: var(--p-head); text-transform: none; } html body .poolse-footer .poolse-footer__title { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; } html body .poolse-sec .elementor-widget-text-editor { font-family: var(--p-body); font-size: 17px; line-height: 1.7; color: var(--p-graphite); } html body :is(.poolse-sec--dark, .poolse-sec--black, .poolse-sec--red) .elementor-widget-text-editor { color: rgba(255, 255, 255, .82); } html body .poolse-sec .elementor-heading-title { font-family: var(--p-head); } html body .poolse-sec .elementor-widget-button .elementor-button { font-family: var(--p-head); font-weight: 600; text-transform: none; } html body .poolse-hero img.poolse-hero__bg, html body .poolse-cta img.poolse-cta__bg { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; border-radius: 0; } @media (max-width: 600px) { .poolse-items--groups .poolse-items__list { gap: 12px; } .poolse-items--groups .poolse-items__item { --c: 2; flex-basis: calc((100% - 12px) / 2); padding: 18px 16px; gap: 6px; border-radius: 18px; } .poolse-items--groups .poolse-items__icon { width: 44px; height: 44px; border-radius: 14px; } .poolse-items--groups .poolse-items__icon svg { width: 24px; height: 24px; } .poolse-items--groups .poolse-items__name { font-size: 1.05rem; } .poolse-items--groups .poolse-items__desc { font-size: 13.5px; } .poolse-items--groups .poolse-items__item:last-child:nth-child(odd) { flex-basis: 100%; } } html body .poolse-qr-main .poolse-qr-block h2 { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--p-red); } html body .poolse-qr-main .poolse-qr-block h3 { font-size: 15px; color: var(--p-black); } html body .poolse-qr-main .poolse-qr-dish__name { color: var(--p-white); } /* Flagi przy językach */ .poolse-flag { display: block; flex-shrink: 0; width: 20px; height: 14px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(27, 27, 27, .14); overflow: hidden; } .poolse-lang__flag { display: inline-flex; } .poolse-lang__flag .poolse-flag { width: 20px; height: 14px; } /* ========================================================================= Kolaż zdjęć – pełne sterowanie (szerokość, wysokość, położenie, warstwy, kadr) ========================================================================= */ .poolse-collage { position: relative; --h: 560px; --gap: 16px; } .poolse-collage--collage { height: var(--h); } .poolse-collage__item { margin: 0; position: relative; } .poolse-collage--collage .poolse-collage__item { position: absolute; } .poolse-collage__item > a, .poolse-collage__item > img { display: block; width: 100%; height: 100%; } html body .poolse-collage .poolse-collage__item img { width: 100%; height: 100%; max-width: none; object-fit: cover; border-radius: 24px; transition: transform .4s var(--p-ease); } .poolse-collage__item { overflow: visible; } .poolse-collage__item.has-shadow img { box-shadow: var(--p-shadow-lg); } html body .poolse-collage .poolse-collage__item.has-frame img { border: 8px solid var(--p-white); } html body .poolse-sec--light .poolse-collage .has-frame img { border-color: var(--p-light); } html body :is(.poolse-sec--dark, .poolse-sec--black) .poolse-collage .has-frame img { border-color: var(--p-ink); } .poolse-collage__item figcaption { position: absolute; left: 12px; bottom: 12px; padding: 5px 10px; border-radius: 8px; background: rgba(27, 27, 27, .75); color: var(--p-white); font-size: 13px; font-weight: 600; } .poolse-collage--stack { display: flex; flex-direction: column; gap: var(--gap); } html body .poolse-collage--stack .poolse-collage__item img { height: auto; max-height: 640px; } .poolse-collage--row { display: flex; gap: var(--gap); height: var(--h); } .poolse-collage--row .poolse-collage__item { flex: 1 1 0; min-width: 0; } /* Plakietka – narożniki */ .poolse-media__badge--tl { right: auto; left: -14px; } .poolse-media__badge--br { top: auto; bottom: 24px; } .poolse-media__badge--bl { top: auto; bottom: 24px; right: auto; left: -14px; } .poolse-collage .poolse-media__badge { z-index: 20; } @media (max-width: 767px) { .poolse-media__badge--tl, .poolse-media__badge--bl { left: 8px; } } html body .poolse-hero .poolse-kicker--light { color: var(--p-white); } html body .poolse-hero .poolse-kicker--light::before { background: var(--p-red); } /* ========================================================================= Tabele alergenów ========================================================================= */ .poolse-atables { display: flex; flex-direction: column; gap: 22px; } .poolse-atable__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; font-size: 14px; color: var(--p-graphite); } .poolse-atable__legend span { display: inline-flex; align-items: center; gap: 8px; } .poolse-atable__ask { font-weight: 600; color: var(--p-ink); } .dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; } .dot--yes { background: var(--p-red); } .dot--trace { border: 2.5px solid var(--p-red); background: transparent; } .poolse-atable__title { margin: 0 0 10px; font-size: 1.15rem; } .poolse-atable__title small { display: block; font-family: var(--p-body); font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--p-red); } .poolse-atable__scroll { overflow-x: auto; border-radius: 16px; border: 1px solid var(--p-line); background: var(--p-white); -webkit-overflow-scrolling: touch; } .poolse-atable table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; } .poolse-atable th, .poolse-atable td { padding: 8px 6px; text-align: center; border-bottom: 1px solid var(--p-line); } .poolse-atable tbody tr:last-child > * { border-bottom: 0; } .poolse-atable tbody tr:nth-child(even) > * { background: rgba(241, 237, 230, .55); } .poolse-atable thead th { vertical-align: bottom; background: var(--p-ink); color: var(--p-white); font-weight: 600; padding-top: 10px; } .poolse-atable__ico { display: block; width: 26px; height: 26px; margin: 0 auto 4px; color: var(--p-white); } .poolse-atable__ico svg { width: 100%; height: 100%; } .poolse-atable__lab { display: block; font-size: 10.5px; line-height: 1.15; max-width: 74px; margin: 0 auto; white-space: normal; } .poolse-atable .poolse-atable__dish { position: sticky; left: 0; z-index: 1; min-width: 180px; text-align: left; padding-left: 14px; font-family: var(--p-head); font-weight: 600; background: var(--p-white); box-shadow: 1px 0 0 var(--p-line); } .poolse-atable thead .poolse-atable__dish { background: var(--p-ink); color: var(--p-white); vertical-align: bottom; } .poolse-atable tbody tr:nth-child(even) .poolse-atable__dish { background: #F6F2EC; } .poolse-atable__dish a { color: var(--p-ink); text-decoration: none; } .poolse-atable__dish a:hover { color: var(--p-red); } .poolse-atable td.is-yes { background: rgba(214, 28, 29, .07); } .poolse-atable td.is-pending { text-align: left; font-size: 13px; color: var(--p-grey); font-style: italic; } @media (max-width: 767px) { .poolse-atable__lab { display: none; } .poolse-atable .poolse-atable__dish { min-width: 130px; font-size: 13px; } .poolse-atable th, .poolse-atable td { padding: 7px 4px; } } /* Menu online – zakładki, oferty */ .poolse-qr-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 18px 0 12px; padding: 5px; border-radius: 16px; background: var(--p-white); border: 1px solid var(--p-line); } .poolse-qr-tabs a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 10px; border-radius: 12px; font-family: var(--p-head); font-weight: 700; font-size: 15px; color: var(--p-ink); text-decoration: none; } .poolse-qr-tabs a svg { width: 20px; height: 20px; } .poolse-qr-tabs a.is-active { background: var(--p-ink); color: var(--p-white); } .poolse-qr-chips { position: sticky; top: 66px; z-index: 5; display: flex; gap: 8px; overflow-x: auto; margin: 0 -16px; padding: 8px 16px; background: var(--p-light); scrollbar-width: none; } .poolse-qr-chips::-webkit-scrollbar { display: none; } .poolse-qr-chips a { flex-shrink: 0; padding: 8px 14px; border-radius: 99px; background: var(--p-white); border: 1px solid var(--p-line); font-weight: 700; font-size: 14px; color: var(--p-ink); text-decoration: none; } .poolse-qr-menu__offer { margin-top: 26px; scroll-margin-top: 130px; } .poolse-qr-menu__offer-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 3px solid var(--p-ink); } html body .poolse-qr-main .poolse-qr-menu__offer-head h2 { margin: 0; font-size: 1.5rem; } .poolse-qr-menu__group { margin-top: 14px; } html body .poolse-qr-main .poolse-qr-menu__group h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 1.1rem; } .poolse-qr-menu__group h3::before { content: ""; width: 6px; height: 18px; border-radius: 3px; background: var(--p-red); } .poolse-qr-pdf { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: var(--p-white); border: 1.5px solid var(--p-ink); color: var(--p-ink); font-weight: 700; text-decoration: none; } .poolse-qr-pdf svg { width: 22px; height: 22px; color: var(--p-red); } .poolse-qr-pdf--sm { margin: 0; padding: 7px 12px; font-size: 13px; border-radius: 99px; } /* ========================================================================= Na żywo + ogłoszenia ========================================================================= */ .poolse-topbar.has-live { background: var(--p-ink); } .poolse-topbar__text--live { display: block !important; } .poolse-live { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; color: var(--p-white); } .poolse-live b { color: var(--p-white); } .poolse-live a { color: var(--p-white); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; } .poolse-live__until { opacity: .75; } .poolse-live__pulse { position: relative; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--p-red); box-shadow: 0 0 0 0 rgba(214, 28, 29, .7); animation: poolse-pulse 1.8s infinite; } @keyframes poolse-pulse { 70% { box-shadow: 0 0 0 9px rgba(214, 28, 29, 0); } 100% { box-shadow: 0 0 0 0 rgba(214, 28, 29, 0); } } @media (max-width: 640px) { .poolse-topbar.has-live .poolse-topbar__links { display: none; } .poolse-topbar.has-live .poolse-topbar__inner { justify-content: flex-start; padding-top: 6px; padding-bottom: 6px; } } .poolse-livecard { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 14px; padding: 22px 24px; border-radius: 20px; background: var(--p-ink); color: var(--p-white); isolation: isolate; } .poolse-livecard::after { content: ""; position: absolute; z-index: -1; right: -40px; top: -40px; width: 160px; height: 160px; background: var(--p-red); opacity: .35; -webkit-mask: url("../img/wycinanka.svg") center / contain no-repeat; mask: url("../img/wycinanka.svg") center / contain no-repeat; } .poolse-livecard__badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 99px; background: rgba(251, 248, 243, .1); font-family: var(--p-head); font-weight: 700; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; } html body .poolse-sec .poolse-livecard .poolse-livecard__title { margin: 0; color: var(--p-white); font-size: 1.5rem; } .poolse-livecard__meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; font-size: 15px; color: rgba(251, 248, 243, .8); } .poolse-livecard__meta span { display: inline-flex; align-items: center; gap: 6px; } .poolse-livecard__meta svg { width: 18px; height: 18px; color: var(--p-red); } .poolse-livecard__note { margin: 0; font-size: 15px; } .poolse-notice { position: relative; z-index: 80; background: var(--p-red); color: var(--p-white); } .poolse-notice--black { background: var(--p-ink); } .poolse-notice--light { background: var(--p-light); color: var(--p-ink); } .poolse-notice__inner { display: flex; align-items: center; gap: 12px; min-height: 48px; padding-top: 8px; padding-bottom: 8px; } .poolse-notice__icon svg { width: 22px; height: 22px; } .poolse-notice__text { flex: 1; font-family: var(--p-head); font-weight: 600; font-size: 15.5px; color: inherit; text-decoration: none; } a.poolse-notice__text:hover { color: inherit; text-decoration: underline; } .poolse-notice__close { flex-shrink: 0; width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(251, 248, 243, .18); color: inherit; font-size: 20px; line-height: 1; cursor: pointer; } .poolse-notice--light .poolse-notice__close { background: rgba(27, 27, 27, .08); } /* ---------- Facebook ---------- */ .poolse-fb { flex: none; } .poolse-event__links { display: flex; align-items: center; gap: 8px 16px; flex-wrap: wrap; justify-content: flex-end; } html body .poolse-event__fb { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px 7px 9px; border-radius: 99px; background: var(--p-ink); color: var(--p-white); font-family: var(--p-head); font-weight: 600; font-size: 13.5px; text-decoration: none; transition: background .2s; } html body .poolse-event__fb:hover { background: var(--p-red); color: var(--p-white); } .poolse-event__fb .poolse-fb { width: 18px; height: 18px; } .poolse-livecard__btns { display: flex; flex-wrap: wrap; gap: 10px; } html body .poolse-btn--fb { display: inline-flex; align-items: center; gap: 8px; background: var(--p-white); color: var(--p-ink); border-color: var(--p-white); } html body .poolse-btn--fb:hover { background: var(--p-light); color: var(--p-ink); } html body .poolse-fbbox .poolse-btn--fb, html body .poolse-sec .poolse-fbbox .poolse-btn--fb { background: var(--p-ink); color: var(--p-white); border-color: var(--p-ink); } html body .poolse-fbbox .poolse-btn--fb:hover { background: var(--p-red); border-color: var(--p-red); } .poolse-fbbox { max-width: 520px; margin: 32px auto 0; } .poolse-fbbox__frame { height: var(--h, 560px); border-radius: 20px; overflow: hidden; background: var(--p-light); border: 1px solid var(--p-line); } .poolse-fbbox__frame.is-loaded { background: #fff; } .poolse-fbbox__frame iframe { display: block; width: 100%; height: 100%; border: 0; } .poolse-fbbox__ph { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px; text-align: center; } .poolse-fbbox__ico { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--p-ink); color: var(--p-white); } .poolse-fbbox__ico .poolse-fb { width: 36px; height: 36px; } .poolse-fbbox__note { margin: 0; font-size: 13px; color: var(--p-grey); } .poolse-fbbox__open { display: inline-flex; margin-top: 12px; } @media (max-width: 560px) { .poolse-event__links { grid-column: 2; justify-content: flex-start; } } .poolse-fbbox__frame:not(.is-loaded) { height: auto; } .poolse-fbbox__frame:not(.is-loaded) .poolse-fbbox__ph { padding: 40px 24px; } .poolse-fbbox__open { justify-content: center; width: 100%; } /* ========================================================================= NAGŁÓWEK v1.2 – górny pasek, menu w kapsule, przełącznik języka, menu mobilne. Selektory z „html body”, żeby kolory linków z zestawu Elementora (np. czarne linki) nigdy nie wygrały na ciemnym tle. ========================================================================= */ /* --- górny pasek --- */ html body .poolse-topbar { background: var(--p-ink); color: rgba(251, 248, 243, .72); font: 500 13.5px/1.4 var(--p-body); } .poolse-topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 42px; } .poolse-topbar__text { margin: 0; display: inline-flex; align-items: center; gap: 10px; } .poolse-topbar__text:not(.poolse-topbar__text--live)::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--p-red); flex: none; } .poolse-topbar__links { display: flex; align-items: center; gap: 6px; } html body .poolse-topbar a, html body .poolse-topbar a:visited { display: inline-flex; align-items: center; gap: 7px; padding: 5px 10px; border-radius: 999px; color: var(--p-white); text-decoration: none; transition: background .2s, color .2s; } html body .poolse-topbar a:hover, html body .poolse-topbar a:focus-visible { background: rgba(251, 248, 243, .08); color: var(--p-white); } html body .poolse-topbar .poolse-icon { width: 15px; height: 15px; color: var(--p-red); fill: currentColor; } html body .poolse-topbar .poolse-social { display: inline-flex; gap: 2px; margin-left: 4px; padding-left: 10px; border-left: 1px solid rgba(251, 248, 243, .14); } html body .poolse-topbar .poolse-social a { width: 30px; height: 30px; padding: 0; justify-content: center; background: none; color: var(--p-white); } html body .poolse-topbar .poolse-social a:hover { background: var(--p-red); } html body .poolse-topbar .poolse-social .poolse-icon { color: currentColor; } html body .poolse-topbar .poolse-live, html body .poolse-topbar .poolse-live b { color: var(--p-white); } html body .poolse-topbar .poolse-live a { padding: 0; color: var(--p-white); text-decoration: underline; text-underline-offset: 3px; background: none; } @media (max-width: 640px) { .poolse-topbar__text:not(.poolse-topbar__text--live) { display: none; } .poolse-topbar__inner { justify-content: center; min-height: 38px; } html body .poolse-topbar { font-size: 12.5px; } html body .poolse-topbar .poolse-social { display: none; } } /* --- pasek nagłówka --- */ html body .poolse-header { position: sticky; top: 0; z-index: 90; background: rgba(251, 248, 243, .94); backdrop-filter: saturate(1.5) blur(14px); -webkit-backdrop-filter: saturate(1.5) blur(14px); border-bottom: 1px solid transparent; transition: box-shadow .25s var(--p-ease), border-color .25s; } .admin-bar .poolse-header { top: 32px; } html body .poolse-header.is-scrolled { border-color: var(--p-line); box-shadow: 0 12px 30px -20px rgba(27, 27, 27, .35); } .poolse-header__inner { display: flex; align-items: center; gap: 20px; min-height: 90px; transition: min-height .25s var(--p-ease); } .poolse-header.is-scrolled .poolse-header__inner { min-height: 74px; } .poolse-header__brand { flex-shrink: 0; margin-right: auto; } .poolse-logo img, .poolse-header__brand .custom-logo { display: block; width: auto; height: 74px; transition: height .25s var(--p-ease); } .poolse-header.is-scrolled .poolse-logo img, .poolse-header.is-scrolled .custom-logo { height: 58px; } .poolse-nav { display: flex; align-items: center; gap: 14px; } .poolse-nav__contact { display: none; } /* menu w kapsule */ html body .poolse-header .poolse-menu { display: flex; align-items: center; gap: 2px; margin: 0; padding: 5px; list-style: none; border-radius: 999px; background: var(--p-light); box-shadow: inset 0 0 0 1px rgba(27, 27, 27, .04); } .poolse-header .poolse-menu > li { position: relative; margin: 0; padding: 0; } .poolse-header .poolse-menu > li::before, .poolse-header .poolse-menu > li::marker { content: none; } html body .poolse-header .poolse-menu a, html body .poolse-header .poolse-menu a:visited { position: relative; display: flex; align-items: center; gap: 6px; padding: 10px 18px; border-radius: 999px; font: 600 15.5px/1.2 var(--p-head); letter-spacing: -.005em; color: var(--p-ink); text-decoration: none; text-transform: none; background: transparent; transition: color .2s, background-color .2s, box-shadow .2s; } html body .poolse-header .poolse-menu > li > a:hover, html body .poolse-header .poolse-menu > li:focus-within > a { color: var(--p-red); background: var(--p-white); box-shadow: 0 4px 12px -6px rgba(27, 27, 27, .25); } html body .poolse-header .poolse-menu > .current-menu-item > a, html body .poolse-header .poolse-menu > .current_page_item > a, html body .poolse-header .poolse-menu > .current-menu-ancestor > a, html body .poolse-header .poolse-menu > .current_page_parent > a, html body .poolse-header .poolse-menu > .current-page-ancestor > a { color: var(--p-white); background: var(--p-ink); box-shadow: 0 6px 16px -8px rgba(27, 27, 27, .6); } html body .poolse-header .poolse-menu > li.menu-item-has-children > a::after { content: ""; width: 7px; height: 7px; margin: -3px 0 0 2px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); opacity: .6; } /* podmenu */ html body .poolse-header .poolse-menu .sub-menu { position: absolute; top: calc(100% + 10px); left: 50%; min-width: 230px; margin: 0; padding: 8px; list-style: none; background: var(--p-white); border: 1px solid var(--p-line); border-radius: 16px; box-shadow: var(--p-shadow-lg); opacity: 0; visibility: hidden; transform: translate(-50%, 6px); transition: .2s var(--p-ease); z-index: 5; } .poolse-header .poolse-menu .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } .poolse-header .poolse-menu li:hover > .sub-menu, .poolse-header .poolse-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); } html body .poolse-header .poolse-menu .sub-menu a { padding: 10px 14px; border-radius: 10px; font-size: 15px; font-weight: 500; } html body .poolse-header .poolse-menu .sub-menu a:hover { background: var(--p-red-soft); color: var(--p-red); box-shadow: none; } html body .poolse-header .poolse-menu .sub-menu .current-menu-item > a { color: var(--p-red); background: var(--p-red-soft); } /* przycisk */ html body .poolse-header .poolse-header__cta { display: inline-flex; align-items: center; gap: 8px; padding: 13px 20px 13px 22px; font-size: 15px; white-space: nowrap; } html body .poolse-header .poolse-header__cta .poolse-icon { width: 17px; height: 17px; fill: currentColor; transition: transform .2s var(--p-ease); } html body .poolse-header .poolse-header__cta:hover .poolse-icon { transform: translateX(3px); } /* przełącznik języka */ html body .poolse-header .poolse-langs { display: inline-flex; flex-direction: row; align-items: center; gap: 2px; margin: 0; padding: 4px; border-radius: 999px; background: transparent; box-shadow: inset 0 0 0 1px var(--p-line); flex-shrink: 0; } html body .poolse-header .poolse-langs a.poolse-langs__item, html body .poolse-header .poolse-langs a.poolse-langs__item:visited { display: inline-flex; flex-direction: row; align-items: center; gap: 6px; height: 34px; min-width: 0; padding: 0 11px 0 8px; margin: 0; border-radius: 999px; font: 700 12.5px/1 var(--p-head); letter-spacing: .06em; color: var(--p-graphite); text-decoration: none; background: transparent; transition: background .2s, color .2s; } html body .poolse-header .poolse-langs a.poolse-langs__item span { display: inline; line-height: 1; } html body .poolse-header .poolse-langs a.poolse-langs__item .poolse-flag { display: block; width: 20px; height: 14px; } html body .poolse-header .poolse-langs a.poolse-langs__item:hover { color: var(--p-red); background: var(--p-light); } html body .poolse-header .poolse-langs a.poolse-langs__item.is-active { background: var(--p-ink); color: var(--p-white); } html body .poolse-header .poolse-langs a.poolse-langs__item.is-active .poolse-flag { box-shadow: 0 0 0 1.5px rgba(251, 248, 243, .9); } /* burger */ html body .poolse-header .poolse-burger { display: none; align-items: center; justify-content: center; flex-shrink: 0; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: var(--p-ink); color: var(--p-white); cursor: pointer; transition: background .2s; } .poolse-burger .poolse-icon { width: 24px; height: 24px; fill: currentColor; } .poolse-burger__close { display: none; } .poolse-nav-open .poolse-burger__open { display: none; } .poolse-nav-open .poolse-burger__close { display: block; } /* średnie ekrany – ciaśniej */ @media (max-width: 1280px) and (min-width: 1025px) { .poolse-header__inner { gap: 12px; } html body .poolse-header .poolse-menu a { padding: 10px 13px; font-size: 15px; } html body .poolse-header .poolse-langs a.poolse-langs__item span { display: none; } html body .poolse-header .poolse-langs a.poolse-langs__item { padding: 0 8px; } .poolse-logo img, .poolse-header__brand .custom-logo { height: 64px; } } /* --- menu mobilne --- */ @media (max-width: 1024px) { .poolse-header__inner { gap: 10px; min-height: 74px; } .poolse-header.is-scrolled .poolse-header__inner { min-height: 66px; } .poolse-logo img, .poolse-header__brand .custom-logo { height: 52px; } .poolse-header.is-scrolled .poolse-logo img, .poolse-header.is-scrolled .custom-logo { height: 46px; } html body .poolse-header .poolse-burger { display: inline-flex; position: relative; z-index: 120; order: 3; } html body .poolse-header .poolse-langs--bar { order: 2; position: relative; z-index: 121; } .poolse-nav { position: fixed; inset: 0; z-index: 110; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 22px; padding: 104px clamp(20px, 6vw, 48px) 32px; overflow-y: auto; background: var(--p-ink); background-image: radial-gradient(120% 60% at 100% 0%, rgba(214, 28, 29, .22), transparent 60%); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: opacity .25s var(--p-ease), transform .25s var(--p-ease), visibility .25s; } .admin-bar .poolse-nav { padding-top: 150px; } .poolse-nav-open .poolse-nav { opacity: 1; visibility: visible; transform: none; } .poolse-nav-open { overflow: hidden; } html body.poolse-nav-open .poolse-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--p-ink); border-color: transparent; } .poolse-nav-open .poolse-header__brand { visibility: hidden; } html body.poolse-nav-open .poolse-header .poolse-burger { background: var(--p-red); } html body .poolse-header .poolse-menu { flex-direction: column; align-items: stretch; gap: 0; padding: 0; background: none; box-shadow: none; border-radius: 0; counter-reset: pm; } .poolse-header .poolse-menu > li { border-bottom: 1px solid rgba(251, 248, 243, .1); counter-increment: pm; } html body .poolse-header .poolse-menu > li > a, html body .poolse-header .poolse-menu > li > a:visited { gap: 16px; padding: 18px 0; border-radius: 0; background: none; box-shadow: none; font-size: clamp(24px, 6.4vw, 32px); font-weight: 700; color: var(--p-white); } html body .poolse-header .poolse-menu > li > a::before { content: counter(pm, decimal-leading-zero); min-width: 26px; font: 600 13px var(--p-body); letter-spacing: .08em; color: var(--p-red); } html body .poolse-header .poolse-menu > li > a:hover, html body .poolse-header .poolse-menu > li:focus-within > a { background: none; box-shadow: none; color: var(--p-white); padding-left: 6px; } html body .poolse-header .poolse-menu > .current-menu-item > a, html body .poolse-header .poolse-menu > .current_page_item > a, html body .poolse-header .poolse-menu > .current-menu-ancestor > a, html body .poolse-header .poolse-menu > .current_page_parent > a, html body .poolse-header .poolse-menu > .current-page-ancestor > a { background: none; box-shadow: none; color: var(--p-red); } html body .poolse-header .poolse-menu > li.menu-item-has-children > a::after { margin-left: auto; } html body .poolse-header .poolse-menu .sub-menu { position: static; min-width: 0; padding: 0 0 14px 42px; background: none; border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; } html body .poolse-header .poolse-menu .sub-menu a { padding: 8px 0; font-size: 17px; color: rgba(251, 248, 243, .75); background: none; } html body .poolse-header .poolse-menu .sub-menu a:hover { color: var(--p-white); background: none; } html body .poolse-header .poolse-header__cta { justify-content: space-between; width: 100%; padding: 18px 26px; font-size: 17px; } .poolse-nav__contact { display: flex; flex-direction: column; gap: 4px; margin-top: auto; padding-top: 18px; border-top: 1px solid rgba(251, 248, 243, .1); } html body .poolse-nav__contact a, html body .poolse-nav__contact a:visited { display: inline-flex; align-items: center; gap: 10px; padding: 8px 0; color: rgba(251, 248, 243, .85); font: 500 15.5px var(--p-body); text-decoration: none; } html body .poolse-nav__contact a:hover { color: var(--p-white); } html body .poolse-nav__contact .poolse-icon { width: 18px; height: 18px; color: var(--p-red); fill: currentColor; } html body .poolse-nav__contact .poolse-social { display: flex; gap: 8px; margin-top: 10px; } html body .poolse-nav__contact .poolse-social a { width: 44px; height: 44px; padding: 0; justify-content: center; border-radius: 50%; background: rgba(251, 248, 243, .08); color: var(--p-white); } html body .poolse-nav__contact .poolse-social a:hover { background: var(--p-red); } html body .poolse-nav__contact .poolse-social .poolse-icon { color: currentColor; } html body.poolse-nav-open .poolse-header .poolse-langs { box-shadow: inset 0 0 0 1px rgba(251, 248, 243, .18); } html body.poolse-nav-open .poolse-header .poolse-langs a.poolse-langs__item { color: var(--p-white); } html body.poolse-nav-open .poolse-header .poolse-langs a.poolse-langs__item:hover { background: rgba(251, 248, 243, .08); } html body.poolse-nav-open .poolse-header .poolse-langs a.poolse-langs__item.is-active { background: rgba(251, 248, 243, .16); } } @media (max-width: 782px) { .admin-bar .poolse-header { top: 0; } .admin-bar .poolse-nav { padding-top: 104px; } } @media (max-width: 480px) { html body .poolse-header .poolse-langs a.poolse-langs__item { gap: 0; height: 32px; padding: 0 7px; } html body .poolse-header .poolse-langs a.poolse-langs__item span { display: none; } html body .poolse-header .poolse-langs a.poolse-langs__item .poolse-flag { width: 22px; height: 15px; } html body .poolse-header .poolse-burger { width: 44px; height: 44px; } .poolse-logo img, .poolse-header__brand .custom-logo { height: 46px; } } /* --- linki na ciemnym tle (stopka, karta „teraz”) – zawsze jasne --- */ html body .poolse-footer a, html body .poolse-footer a:visited { color: rgba(251, 248, 243, .8); text-decoration: none; } html body .poolse-footer a:hover { color: var(--p-white); } html body .poolse-footer .poolse-menu a { color: rgba(251, 248, 243, .8); background: none; } html body .poolse-footer .poolse-social a { color: var(--p-white); } html body .poolse-footer .poolse-btn--red, html body .poolse-footer .poolse-btn--red:hover { color: var(--p-white); } html body .poolse-livecard a.poolse-btn--red { color: var(--p-white); } html body .poolse-notice a.poolse-notice__text { color: inherit; } /* ========================================================================= Rozwijane menu (panel z ikonami i opisami) ========================================================================= */ .poolse-sub-toggle { display: none; } html body .poolse-header .poolse-mega { position: absolute; top: calc(100% + 12px); left: 50%; z-index: 5; width: 380px; padding: 0; opacity: 0; visibility: hidden; transform: translate(-50%, 8px); transition: opacity .2s var(--p-ease), transform .2s var(--p-ease), visibility .2s; } html body .poolse-header .poolse-mega:has(.poolse-mega__grid > li:nth-child(4)) { width: 600px; } .poolse-header .poolse-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; } .poolse-header .poolse-menu > li:hover > .poolse-mega, .poolse-header .poolse-menu > li:focus-within > .poolse-mega, .poolse-header .poolse-menu > li.is-open > .poolse-mega { opacity: 1; visibility: visible; transform: translate(-50%, 0); } .poolse-mega__in { overflow: hidden; border-radius: 22px; background: var(--p-white); border: 1px solid var(--p-line); box-shadow: 0 30px 60px -24px rgba(27, 27, 27, .4); } html body .poolse-header a.poolse-mega__head, html body .poolse-header a.poolse-mega__head:visited { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 0; background: var(--p-ink); color: var(--p-white); text-decoration: none; box-shadow: none; } html body .poolse-header a.poolse-mega__head:hover { background: #242424; color: var(--p-white); } .poolse-mega__headico { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 14px; background: var(--p-red); color: var(--p-white); } .poolse-mega__headico .poolse-svg { width: 24px; height: 24px; } .poolse-mega__headtxt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .poolse-mega__headtxt b { font: 700 17px/1.2 var(--p-head); } .poolse-mega__headtxt small { font: 500 13px/1.35 var(--p-body); color: rgba(251, 248, 243, .65); } .poolse-mega__all { display: inline-flex; align-items: center; gap: 6px; flex: none; font: 600 13px var(--p-head); color: var(--p-white); opacity: .85; white-space: nowrap; } .poolse-mega__all .poolse-icon { width: 15px; height: 15px; fill: currentColor; transition: transform .2s; } .poolse-mega__head:hover .poolse-mega__all .poolse-icon { transform: translateX(3px); } html body .poolse-header .poolse-mega .poolse-mega__grid { position: static; display: grid; grid-template-columns: 1fr; gap: 2px; min-width: 0; margin: 0; padding: 8px; list-style: none; background: none; border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; } html body .poolse-header .poolse-mega:has(.poolse-mega__grid > li:nth-child(4)) .poolse-mega__grid { grid-template-columns: 1fr 1fr; } .poolse-mega__grid > li { margin: 0; } html body .poolse-header .poolse-mega a.poolse-mega__item, html body .poolse-header .poolse-mega a.poolse-mega__item:visited { display: flex; align-items: flex-start; gap: 12px; padding: 12px; border-radius: 14px; background: transparent; color: var(--p-ink); text-decoration: none; box-shadow: none; font-weight: 400; } html body .poolse-header .poolse-mega a.poolse-mega__item:hover, html body .poolse-header .poolse-mega a.poolse-mega__item:focus-visible { background: var(--p-light); color: var(--p-ink); } .poolse-mega__ico { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 12px; background: var(--p-red-soft); color: var(--p-red); transition: background .2s, color .2s; } .poolse-mega__ico .poolse-svg { width: 22px; height: 22px; } .poolse-mega__ico .poolse-icon { width: 18px; height: 18px; fill: currentColor; } .poolse-mega__item:hover .poolse-mega__ico { background: var(--p-red); color: var(--p-white); } .poolse-mega__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-top: 1px; } .poolse-mega__txt b { font: 700 15px/1.25 var(--p-head); color: var(--p-ink); } .poolse-mega__txt small { font: 500 13px/1.35 var(--p-body); color: var(--p-grey); } html body .poolse-header .poolse-mega .current-menu-item > a.poolse-mega__item { background: var(--p-red-soft); } /* menu mobilne: akordeon */ @media (max-width: 1024px) { .poolse-header .poolse-menu > li.menu-item-has-children { position: relative; } html body .poolse-header .poolse-menu > li.menu-item-has-children > a { padding-right: 56px; } html body .poolse-header .poolse-menu > li.menu-item-has-children > a::after { display: none; } html body .poolse-header .poolse-sub-toggle { display: grid; place-items: center; position: absolute; right: 0; top: 50%; margin-top: -22px; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(251, 248, 243, .08); color: var(--p-white); cursor: pointer; } .poolse-header .poolse-menu > li.menu-item-has-children > .poolse-sub-toggle { top: 14px; margin-top: 0; } .poolse-sub-toggle::before { content: ""; width: 9px; height: 9px; margin-top: -4px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .25s var(--p-ease), margin .25s; } html body .poolse-header .poolse-sub-toggle:hover { background: rgba(251, 248, 243, .16); } html body .poolse-header li.is-open > .poolse-sub-toggle { background: var(--p-red); } li.is-open > .poolse-sub-toggle::before { transform: rotate(-135deg); margin-top: 4px; } html body .poolse-header .poolse-mega, html body .poolse-header .poolse-mega:has(.poolse-mega__grid > li:nth-child(4)) { position: static; width: auto; transform: none; opacity: 1; visibility: visible; display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s var(--p-ease); } .poolse-header .poolse-menu > li:hover > .poolse-mega, .poolse-header .poolse-menu > li:focus-within > .poolse-mega { transform: none; } html body .poolse-header .poolse-menu > li.menu-item.is-open > .poolse-mega.poolse-mega { grid-template-rows: 1fr; transform: none; } .poolse-mega::before { display: none; } .poolse-mega__in { min-height: 0; overflow: hidden; border: 0; border-radius: 0; background: none; box-shadow: none; } html body .poolse-header a.poolse-mega__head { display: none; } html body .poolse-header .poolse-mega .poolse-mega__grid, html body .poolse-header .poolse-mega:has(.poolse-mega__grid > li:nth-child(4)) .poolse-mega__grid { grid-template-columns: 1fr; padding: 0 0 16px; gap: 4px; } html body .poolse-header .poolse-mega a.poolse-mega__item { align-items: center; padding: 10px 12px; border-radius: 14px; background: rgba(251, 248, 243, .05); } html body .poolse-header .poolse-mega a.poolse-mega__item:hover { background: rgba(251, 248, 243, .1); } .poolse-mega__ico { width: 38px; height: 38px; background: rgba(214, 28, 29, .18); color: #FF6B6B; } .poolse-mega__txt b { color: var(--p-white); font-size: 16px; } .poolse-mega__txt small { color: rgba(251, 248, 243, .55); } }