i
do pola HTML — usuwamy ich wpływ */
.ast-above-header-bar .ast-builder-html-element p { margin: 0 !important; }
.ast-above-header-bar br { display: none; }
/* Link w pasku — klikalny na całej szerokości */
.pw-bar {
display: block;
padding: 9px 16px;
text-align: center;
color: var(--pw-tlo) !important;
font-family: var(--pw-sans);
font-size: 13px;
letter-spacing: 0.06em;
text-decoration: none !important;
transition: opacity .2s;
}
.pw-bar:hover { opacity: .8; }
/* Desktop: długi tekst / telefon: krótki tekst */
.pw-short { display: none; }
@media (max-width: 921px) {
.pw-long { display: none; }
.pw-short { display: inline; }
}
/* =====================================================================
4. NAGŁÓWEK — LOGO
===================================================================== */
/* Delikatne powiększenie i rozjaśnienie logo po najechaniu */
.custom-logo {
transition: transform .3s ease, opacity .3s ease;
}
.custom-logo:hover {
transform: scale(1.05);
opacity: .8;
}
/* =====================================================================
5. MENU DESKTOP (od 922 px)
Libre Baskerville, brąz, kursywa po najechaniu i na aktywnej podstronie.
===================================================================== */
@media (min-width: 922px) {
.ast-desktop .main-header-menu > .menu-item > .menu-link {
padding: 0 16px !important;
font-family: var(--pw-serif) !important;
font-size: 15px !important;
font-weight: 400 !important;
color: var(--pw-braz) !important;
white-space: nowrap; /* pozycje nie łamią się na 2 linie */
}
.ast-desktop .main-header-menu > .menu-item > .menu-link:hover,
.ast-desktop .main-header-menu > .current-menu-item > .menu-link {
font-style: italic;
}
}
/* =====================================================================
6. MENU MOBILE (do 921 px)
===================================================================== */
/* 6a. Własna ikona hamburgera (3 kreski, środkowa krótsza) */
#ast-mobile-header button.menu-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
#ast-mobile-header button.menu-toggle svg {
display: none !important; /* ukrywa domyślną ikonę Astry */
}
#ast-mobile-header button.menu-toggle::before {
content: "";
display: block;
width: 26px;
height: 26px;
background-color: var(--pw-braz);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M3 7h18M3 12h12M3 17h18'/%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' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M3 7h18M3 12h12M3 17h18'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Po otwarciu menu ikona zmienia się w X */
#ast-mobile-header button.menu-toggle.toggled::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}
/* 6b. Pełnoekranowe menu: duże linki do prawej, numery 01, 02… */
@media (max-width: 921px) {
.ast-mobile-header-content,
#ast-mobile-popup .ast-mobile-popup-inner {
background: var(--pw-tlo) !important;
}
.ast-mobile-header-content {
min-height: calc(100vh - 80px); /* menu wypełnia cały ekran */
padding: 40px 0 !important;
}
#ast-hf-mobile-menu { counter-reset: menu; }
#ast-hf-mobile-menu > .menu-item {
counter-increment: menu;
border: 0 !important;
}
#ast-hf-mobile-menu > .menu-item > .menu-link {
display: block !important;
padding: 0.3em 24px !important;
text-align: right;
background: transparent !important;
border: 0 !important;
font-family: var(--pw-serif) !important;
font-size: clamp(24px, 7vw, 44px) !important;
font-weight: 400 !important;
line-height: 1.2;
letter-spacing: -0.01em;
text-transform: none !important;
color: var(--pw-braz) !important;
}
/* Numer przed pozycją (01, 02…) */
#ast-hf-mobile-menu > .menu-item > .menu-link::before {
content: counter(menu, decimal-leading-zero);
margin-right: 0.7em;
vertical-align: 0.35em;
font-family: var(--pw-sans);
font-size: 15px;
font-weight: 400;
letter-spacing: 0.05em;
}
#ast-hf-mobile-menu .ast-icon { display: none !important; } /* strzałki Astry */
#ast-hf-mobile-menu > .menu-item > .menu-link:hover,
#ast-hf-mobile-menu > .current-menu-item > .menu-link {
font-style: italic;
}
}
/* =====================================================================
7. INFO-BOXY (Spectra / UAGB)
Klasy nadajesz w bloku: Zaawansowane → Dodatkowe klasy CSS
===================================================================== */
/* Ikona "i" w prawym górnym rogu boxa — klasa: custom-info-box */
.custom-info-box {
position: relative;
}
.custom-info-box::before {
content: "";
position: absolute;
top: 10px;
right: 10px;
z-index: 1;
width: 30px;
height: 30px;
background: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-13h2v6h-2zm0 8h2v2h-2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Box o stałej wysokości 400 px, treść w kolumnie — wspólne dla obu klas */
.infobox-dol-gora.uagb-infobox__content-wrap,
.moja-specjalna-klasa.uagb-infobox__content-wrap {
display: flex;
flex-direction: column;
height: 400px;
padding: 20px;
box-sizing: border-box;
}
/* moja-specjalna-klasa: tytuł przyklejony do góry, opis do dołu */
.moja-specjalna-klasa.uagb-infobox__content-wrap {
justify-content: space-between;
}
.moja-specjalna-klasa .uagb-ifb-title-wrap { margin-bottom: 0; }
.moja-specjalna-klasa .uagb-ifb-desc { margin-top: auto; }
/* =====================================================================
8. ELEMENTY TREŚCI
===================================================================== */
/* Ikona + tekst w jednej linii (na telefonie: ikona nad tekstem) — klasa: resp-icon-text */
.resp-icon-text {
display: flex;
flex-wrap: nowrap;
align-items: flex-end;
justify-content: flex-start;
gap: 12px;
width: 100%;
font-family: var(--pw-serif);
font-weight: 700;
font-size: 24px;
color: var(--pw-braz);
}
@media (max-width: 768px) {
.resp-icon-text {
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
font-size: 20px;
}
.resp-icon-text img {
order: -1;
width: 25px !important;
height: 25px !important;
}
}
/* Tekst w sekcji bloga — klasa: sekcja-blog */
.sekcja-blog {
font-family: var(--pw-sans);
line-height: 1.5;
color: var(--pw-braz);
}
/* Nazwa miasta w nagłówku: nowa linia + kursywa ("…pod klucz / Poznań")
Użycie w nagłówku Spectra: Poznań */
.uagb-heading-text .city {
display: block;
font-style: italic;
}
/* Galeria ukryta na stronie — zdjęcia otwierają się tylko w lightboxie — klasa: ukryta-galeria */
.ukryta-galeria {
display: none !important;
}
/* Bez podpisów pod zdjęciami w karuzeli Jetpack */
.jp-carousel-photo-caption {
display: none !important;
}
/* =====================================================================
9. FAQ (Rank Math) — kafelki
Klasa pw-faq w bloku FAQ Rank Math (Zaawansowane → Dodatkowe klasy CSS)
===================================================================== */
.rank-math-list.pw-faq,
.pw-faq .rank-math-list {
display: flex;
flex-direction: column;
gap: 14px; /* odstęp między kafelkami */
}
.pw-faq .rank-math-list-item {
margin: 0;
padding: 20px 24px;
background-color: var(--pw-tlo-jasne);
border: 1px solid var(--pw-zloto);
border-radius: 2px;
}
.pw-faq .rank-math-question {
margin: 0 0 10px;
font-family: var(--pw-serif) !important;
font-weight: 700;
font-size: 18px;
line-height: 1.35;
color: var(--pw-braz) !important;
}
.pw-faq .rank-math-answer,
.pw-faq .rank-math-answer p {
margin: 0;
font-family: var(--pw-sans) !important;
font-weight: 400;
font-size: 15px;
line-height: 1.6;
color: var(--pw-szary) !important;
}
.pw-faq .rank-math-answer a {
font-weight: 600;
text-decoration: underline;
color: var(--pw-braz) !important;
}
/* =====================================================================
10. STOPKA
===================================================================== */
.pw-footer__brand-name {
margin: 0 0 14px;
font-family: var(--pw-serif);
font-weight: 700;
font-size: 20px;
color: var(--pw-stopka-jasny);
}
.pw-footer-col h4 {
margin: 0 0 16px;
font-family: var(--pw-sans);
font-size: 12px;
font-weight: 700;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--pw-stopka-jasny);
}
.pw-footer-col ul {
margin: 0;
padding: 0;
}
.pw-footer-col p,
.pw-footer-col li {
margin: 0 0 8px;
list-style: none;
font-size: 14.5px;
line-height: 1.6;
color: var(--pw-stopka-tekst);
}
.pw-footer-col a {
color: var(--pw-stopka-tekst);
text-decoration: none;
transition: color .15s;
}
.pw-footer-col a:hover {
color: #fff;
text-decoration: underline;
}
/* =====================================================================
11. WYJĄTKI DLA KONKRETNYCH STRON
===================================================================== */
/* Strona ID 3723 (landing): bez nagłówka */
.page-id-3723 .site-header {
display: none !important;
}