/* =============================================================
FONTS - self-hosted (z assets/fonts/), font-display:swap
============================================================= */
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/jost-v20-latin_latin-ext-300.woff2') format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/jost-v20-latin_latin-ext-regular.woff2') format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/jost-v20-latin_latin-ext-500.woff2') format('woff2')}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/cinzel-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/cinzel-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/cinzel-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/cinzel-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/cinzel-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/cinzel-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* =============================================================
OSIEDLE GALILEO - main stylesheet
-------------------------------------------------------------
00. RESET
01. TOKENS
02. BASE TYPOGRAPHY
03. LAYOUT (container / section / headers)
04. COMPONENTS
.infobar .topbar .nav .burger .logo
.btn .link-download
.hero .image-band .parallax
.stats .amenities .types .two-col .feature-list
.location-grid .gallery-grid .lightbox
.filters .apt-grid .apt-card .apt-table .apt-stats .apt-empty
.roi-grid .promo-grid
.investor .quote .faq
.contact .form
.footer .floating-call .modal
.page .error-404
05. UTILITIES
06. RESPONSIVE
============================================================= */
/* -- PRELOADER ------------------------------------------------- */
.preloader{
position:fixed;inset:0;z-index:9999;
background:#0B1E36;
display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;
/* Auto-hide przez CSS animation (nie transition) - odporne na WP Rocket Delay JS,
który odracza KAŻDY JS do pierwszej interakcji. Bez tego preloader wisiałby
dopóki user nie ruszy myszką. JS (gdy odpali) dodaje .is-hidden szybciej. */
animation:preloader-autohide 1s ease 500ms forwards;
}
.preloader.is-hidden{opacity:0;visibility:hidden;pointer-events:none;animation:none}
@keyframes preloader-autohide{
0%{opacity:1;visibility:visible;pointer-events:auto}
99%{opacity:0;visibility:visible;pointer-events:none}
100%{opacity:0;visibility:hidden;pointer-events:none}
}
.preloader__logo{
width:120px;height:120px;
overflow:hidden;
animation:preloaderScale 1.2s ease-in-out infinite;
}
.preloader__logo img,.preloader__logo svg{width:100%;height:100%;display:block}
.preloader__text{
font:400 12px/1 'Jost',sans-serif;letter-spacing:6px;text-transform:uppercase;
color:#B9C3DA;opacity:.85;
animation:preloaderFade 1.6s ease-in-out infinite;
}
.preloader__bar{
width:140px;height:1px;background:rgba(185,195,218,.2);overflow:hidden;
margin-top:8px;
}
.preloader__bar span{
display:block;height:100%;width:40%;background:#B9C3DA;
animation:preloaderLoad 1.6s ease-in-out infinite;
}
@keyframes preloaderScale{
0%,100%{transform:scale(1);opacity:1}
50%{transform:scale(1.08);opacity:.85}
}
@keyframes preloaderFade{
0%,100%{opacity:.45}
50%{opacity:1}
}
@keyframes preloaderLoad{
0%{transform:translateX(-100%)}
50%{transform:translateX(100%)}
100%{transform:translateX(250%)}
}
@media (prefers-reduced-motion:reduce){
.preloader__logo,.preloader__text,.preloader__bar span{animation:none}
}
/* -- BADGES HIDE - ukrywa znaki wodne pluginów ----------------- */
.w-webflow-badge,
.iubenda-cs-brand-badge{display:none !important}
/* -- 00 RESET -------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{
scroll-behavior:smooth;
-webkit-text-size-adjust:100%;
/* Brak białych pasków przy scroll-bounce (iOS / desktop overflow) */
background-color:#081428; /* navy-deep hardcoded - var() niezdefiniowana tu w root pre-context */
}
body{background-color:var(--c-cream)} /* cream tło body jako podstawa dla jasnych sekcji */
img,svg{max-width:100%;height:auto;display:block}
button{font:inherit;background:0 0;border:0;cursor:pointer;color:inherit}
a{color:inherit;text-decoration:none}
summary::-webkit-details-marker{display:none}
/* -- 01 TOKENS ------------------------------------------------- */
:root{
--c-navy:#0B1E36;
--c-navy-deep:#081428;
--c-navy-mid:#11294a;
--c-gold:#B9C3DA;
--c-gold-soft:#D6DCEA;
--c-gold-deep:#4E5FA0;
--c-cream:#F5EFE3;
--c-cream-light:#FAF6EC;
--c-beige:#E8DFCE;
--c-white:#fff;
--c-green:#5a8a5d;
--c-error:#8B3A3A; /* stonowany terracotta - zgodny z paletą premium */
--c-placeholder:#e0d9ca; /* fallback dla obrazów */
--c-muted:rgba(245,239,227,.6);
--c-border-light:rgba(185,195,218,.2);
--c-border-dark:rgba(11,30,54,.12);
--ff-sans:'Jost','Jost Fallback',-apple-system,BlinkMacSystemFont,sans-serif;
--ff-serif:'Cinzel','Cormorant Fallback',Georgia,'Times New Roman',serif;
--gap-xl:120px;
--gap-lg:80px;
--gap-md:48px;
--gap-sm:24px;
--r:2px;
--r-pill:40px;
--t:.2s ease;
--shadow-card:0 4px 20px rgba(11,30,54,.06);
--shadow-card-hover:0 20px 50px rgba(11,30,54,.15);
--shadow-modal:0 40px 100px rgba(0,0,0,.4);
}
/* -- 02 BASE TYPOGRAPHY --------------------------------------- */
body{
margin:0;padding:0;
font:300 16px/1.7 var(--ff-sans);
color:var(--c-navy);
background:var(--c-navy-deep); /* dopasowane do stopki - brak kremowego pasa na dole */
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
overflow-x:hidden;
font-synthesis:none;
}
/* Fallback fonts - podobne metryki, żeby zminimalizować CLS gdy Google Fonts się załadują */
@font-face{
font-family:'Jost Fallback';
src:local('Arial');
ascent-override:94%;
descent-override:22%;
line-gap-override:0%;
size-adjust:106%;
}
@font-face{
font-family:'Cormorant Fallback';
src:local('Georgia');
ascent-override:85%;
descent-override:22%;
size-adjust:108%;
}
/* -- 03 LAYOUT ------------------------------------------------- */
.container{max-width:1280px;margin:0 auto;padding:0 48px}
.section{padding:var(--gap-xl) 0}
.section--light{background:var(--c-cream-light)}
.section--cream{background:var(--c-cream)}
.section--dark{background:var(--c-navy);color:var(--c-cream)}
.section--beige{background:var(--c-beige)}
.section-header{text-align:center;margin-bottom:var(--gap-lg)}
.section-header--left{text-align:left;margin-bottom:64px}
.section-header h2{
font:300 52px/1.1 var(--ff-serif);
letter-spacing:-1px;
margin:0 auto 24px;
max-width:800px;
}
.section-header--left h2{margin-left:0}
.section-header h2 em{font-style:italic;color:var(--c-gold);font-weight:300}
.eyebrow{
font:400 11px/1.4 var(--ff-sans);
letter-spacing:4px;
color:var(--c-gold);
text-transform:uppercase;
margin-bottom:20px;
}
/* WCAG AA fix: na jasnych tłach złoto #B9C3DA daje tylko 2:1. Ciemniejszy odcień na jasnych tłach. */
.section--light .eyebrow,
.section--cream .eyebrow,
.section--beige .eyebrow{color:var(--c-gold-deep)}
.intro{font-size:16px;line-height:1.8;max-width:680px;margin:0 auto;opacity:.85}
.section-header--left .intro{margin:0}
/* -- 04 COMPONENTS -------------------------------------------- */
/* Infobar */
.infobar{
background:var(--c-navy-deep);
color:var(--c-cream);
font:400 11px/1.4 var(--ff-sans);
letter-spacing:2px;
text-transform:uppercase;
padding:10px 0;
text-align:center;
}
.infobar strong{color:var(--c-gold);font-weight:400}
.infobar a{margin:0 14px;transition:color var(--t)}
.infobar a:hover{color:var(--c-gold)}
/* Header */
.topbar{
background:rgba(11,30,54,.95);
backdrop-filter:blur(10px);
-webkit-backdrop-filter:blur(10px);
color:var(--c-cream);
padding:9px 0;
border-bottom:1px solid var(--c-border-light);
position:sticky;top:0;z-index:100;
}
.topbar__inner{display:flex;justify-content:space-between;align-items:center;gap:20px}
.logo{display:flex;align-items:center;gap:14px;min-height:44px}
.logo svg,.logo img.logo__mark,.logo .custom-logo{
width:64px;height:64px;
display:block;flex-shrink:0;
border-radius:50%; /* logo ma navy kwadrat + biały circle - dzięki radius 50% widzimy tylko okrąg */
overflow:hidden;
box-shadow:0 2px 12px rgba(0,0,0,.2);
}
.logo__subtitle{
display:block;
font:400 11px/1.3 var(--ff-sans);
letter-spacing:3.5px;
text-transform:uppercase;
color:var(--c-gold);
opacity:.9;
}
.logo__text{display:flex;align-items:center}
.nav{display:flex;gap:28px;align-items:center}
.nav__links{display:contents}
.nav__mobile-header,.nav__mobile-footer{display:none}
.nav__num{display:none}
.nav a{
font:400 11px/1 var(--ff-sans);
letter-spacing:2.5px;
text-transform:uppercase;
color:var(--c-cream);
transition:color var(--t);
}
.nav a:hover,.nav a.is-active{color:var(--c-gold)}
.nav__cta,.nav .menu-item-cta a{
padding:10px 18px;border:1px solid var(--c-gold);border-radius:var(--r);
transition:all var(--t);
}
.nav__cta:hover,.nav .menu-item-cta a:hover{background:var(--c-gold);color:var(--c-navy) !important}
/* Burger - animowany ×/≡ */
.burger{
display:none;
position:relative;
min-width:44px;min-height:44px;
width:44px;height:44px;
color:var(--c-cream);
border-radius:var(--r);
transition:all var(--t);
}
.burger:hover{color:var(--c-gold)}
.burger__lines{
position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;
}
.burger__lines span{
width:22px;height:1.5px;background:currentColor;
transition:transform .3s ease, opacity .2s ease;
}
.burger[aria-expanded="true"] .burger__lines span:nth-child(1){transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] .burger__lines span:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
/* Sekcyjny CTA - prowadzi użytkownika z sekcji do mieszkań lub kontaktu */
.section-cta{
text-align:center;margin-top:56px;
padding-top:40px;border-top:1px solid var(--c-border-light);
}
.section--light .section-cta,.section--cream .section-cta,.section--beige .section-cta{
border-top-color:var(--c-border-dark);
}
.section-cta__text{
font:400 italic 16px/1.5 var(--ff-serif);
margin-bottom:20px;opacity:.8;
}
.section-cta .btn{min-width:260px}
/* Buttons */
.btn{
display:inline-block;padding:16px 32px;
font:400 12px/1 var(--ff-sans);
letter-spacing:3px;text-transform:uppercase;
border:1px solid transparent;border-radius:var(--r);
transition:all .25s ease;
}
.btn--primary{background:var(--c-gold);color:var(--c-navy);border-color:var(--c-gold)}
.btn--primary:hover{background:transparent;color:var(--c-gold)}
.btn--ghost{color:var(--c-cream);border-color:var(--c-cream)}
.btn--ghost:hover{background:var(--c-cream);color:var(--c-navy)}
.btn--navy{background:var(--c-navy);color:var(--c-cream);border-color:var(--c-navy)}
.btn--navy:hover{background:var(--c-gold);color:var(--c-navy);border-color:var(--c-gold)}
.link-download{
display:inline-block;
font:400 10px/1 var(--ff-sans);
letter-spacing:2px;text-transform:uppercase;
color:var(--c-gold);
padding:8px 14px;
border:1px solid var(--c-gold);
border-radius:var(--r);
transition:all var(--t);
white-space:nowrap;
cursor:pointer;
}
.link-download:hover{background:var(--c-gold);color:var(--c-cream)}
/* Hero - 2 kolumny: content lewy + form prawy */
.hero{
background:var(--c-navy);
color:var(--c-cream);
padding:100px 0 80px;
position:relative;
overflow:hidden;
display:flex;align-items:center;
}
.hero__bg{
position:absolute;inset:0;z-index:0;
width:100%;height:100%;
object-fit:cover;object-position:center;
display:block;
}
.hero__bg img{
width:100%;height:100%;
object-fit:cover;object-position:center;
display:block;
}
.hero::before{
content:'';
position:absolute;inset:0;
background:
linear-gradient(135deg,rgba(11,30,54,.92) 0%,rgba(11,30,54,.75) 45%,rgba(11,30,54,.55) 100%),
linear-gradient(to top, var(--c-navy) 0%, transparent 30%);
z-index:1;
}
.hero__grid{
display:grid;grid-template-columns:1.4fr 1fr;gap:56px;
align-items:center;position:relative;z-index:2;width:100%;
}
.hero__content{max-width:640px}
.hero h1{
font:300 clamp(34px, 5.4vw, 64px)/1.02 var(--ff-serif);
letter-spacing:-1px;
margin:20px 0 24px;
}
.hero h1 em,.hero h1 p em{font-style:italic;color:var(--c-gold);font-weight:300}
.hero h1 p{margin:0}
.hero__lead{font-size:16px;line-height:1.7;max-width:520px;opacity:.92;margin-bottom:28px}
.hero__lead strong{font-weight:400;color:var(--c-gold-soft)}
.hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px}
.hero__meta{
display:flex;gap:36px;flex-wrap:wrap;
padding-top:28px;border-top:1px solid var(--c-border-light);
max-width:560px;
}
.hero__meta > div{min-width:110px}
.meta__label{font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;color:var(--c-gold);text-transform:uppercase;margin-bottom:6px}
.meta__value{font:400 24px/1.2 var(--ff-serif)}
/* Hero form - po prawej, kompaktowy */
.hero__form-wrap{
background:rgba(11,30,54,.85);
backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
border:1px solid rgba(185,195,218,.25);
border-radius:4px;
padding:32px 28px;
box-shadow:0 20px 60px rgba(0,0,0,.4);
max-width:400px;
justify-self:end;
width:100%;
}
.hero-form__eyebrow{
font:400 10px/1 var(--ff-sans);letter-spacing:3px;
text-transform:uppercase;color:var(--c-gold);margin-bottom:8px;
}
.hero-form__title{
font:300 32px/1.05 var(--ff-serif);
color:var(--c-cream);margin:0 0 6px;letter-spacing:-.3px;
}
.hero-form__title em{font-style:italic;color:var(--c-gold);font-weight:300}
.hero-form__sub{font-size:13px;line-height:1.5;opacity:.75;margin:0 0 20px}
.hero-form__field{margin-bottom:12px}
.hero-form__field label{
display:block;
font:400 10px/1 var(--ff-sans);letter-spacing:1.5px;
text-transform:uppercase;color:var(--c-gold);opacity:.85;
margin-bottom:5px;
}
.hero-form__field input{
width:100%;padding:11px 14px;
background:rgba(245,239,227,.06);
border:1px solid rgba(245,239,227,.12);
color:var(--c-cream);border-radius:var(--r);
font:400 14px/1.4 var(--ff-sans);
transition:border-color var(--t),background var(--t);
}
.hero-form__field input:focus{
outline:0;border-color:var(--c-gold);background:rgba(245,239,227,.1);
}
.hero-form__check{
display:flex;gap:8px;align-items:flex-start;
font-size:11px;line-height:1.4;opacity:.75;
margin:10px 0 16px;cursor:pointer;
}
.hero-form__check input{margin-top:2px;flex-shrink:0;accent-color:var(--c-gold)}
.hero-form__submit{
width:100%;padding:14px;
background:var(--c-gold);color:var(--c-navy);
border:0;border-radius:var(--r);
font:400 12px/1 var(--ff-sans);letter-spacing:3px;text-transform:uppercase;
cursor:pointer;transition:all var(--t);
min-height:44px;
}
.hero-form__submit:hover{background:var(--c-cream);transform:translateY(-1px);box-shadow:0 6px 18px rgba(185,195,218,.3)}
.hero-form__footnote{
text-align:center;margin:14px 0 0;
font:400 12px/1.4 var(--ff-sans);opacity:.75;
}
.hero-form__footnote a{color:var(--c-gold);font-weight:500;transition:color var(--t)}
.hero-form__footnote a:hover{color:var(--c-cream)}
/* Image band (parallax) */
.image-band,.parallax{
width:100%;
height:520px;
background:var(--c-navy) center/cover no-repeat;
position:relative;
overflow:hidden;
}
.band-slider{
width:100%;
height:85vh;
min-height:640px;
max-height:920px;
background:var(--c-navy) center/cover no-repeat;
position:relative;
overflow:hidden;
}
.image-band::after{
content:'';position:absolute;inset:0;
background:linear-gradient(to bottom,rgba(11,30,54,.15),rgba(11,30,54,.5));
}
/* Auto-slider pasa zdjęciowego */
.band-slider__track{position:absolute;inset:0}
.band-slider__slide{
position:absolute;inset:0;
opacity:0;
transition:opacity 1s ease-in-out;
display:flex;align-items:flex-end;justify-content:center;
padding:48px 32px;
}
.band-slider__img{
position:absolute;inset:0;z-index:0;
width:100%;height:100%;
object-fit:cover;object-position:50% 75%;
display:block;
}
.band-slider__img img{
width:100%;height:100%;
object-fit:cover;object-position:50% 75%;
display:block;
}
/* Slider - pełny środek kadru */
.band-slider--partner .band-slider__img,
.band-slider--partner .band-slider__img img{object-position:50% 50%}
.band-slider__slide.is-active{opacity:1;z-index:2}
.band-slider__slide::after{
content:'';position:absolute;inset:0;z-index:0;
background:linear-gradient(to bottom,rgba(11,30,54,.1) 0%,rgba(11,30,54,.15) 50%,rgba(11,30,54,.55) 100%);
}
.band-slider__caption{
position:relative;z-index:2;
font:400 italic clamp(18px,2.2vw,24px)/1.3 var(--ff-serif);
color:var(--c-cream);
text-shadow:0 2px 20px rgba(0,0,0,.4);
padding:12px 24px;
background:rgba(11,30,54,.45);
backdrop-filter:blur(6px);
-webkit-backdrop-filter:blur(6px);
border-radius:var(--r);
border:1px solid var(--c-border-light);
}
/* Strzałki */
.band-slider__arrow{
position:absolute;top:50%;transform:translateY(-50%);z-index:3;
width:52px;height:52px;border-radius:50%;
background:rgba(11,30,54,.45);color:var(--c-cream);
border:1px solid rgba(245,239,227,.3);
display:flex;align-items:center;justify-content:center;
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
transition:all var(--t);opacity:.7;
}
.band-slider__arrow:hover{background:var(--c-gold);color:var(--c-navy);opacity:1;border-color:var(--c-gold)}
.band-slider__arrow svg{width:22px;height:22px}
.band-slider__arrow--prev{left:24px}
.band-slider__arrow--next{right:24px}
/* Kropki */
.band-slider__dots{
position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:3;
display:flex;gap:8px;
padding:8px 14px;border-radius:var(--r-pill);
background:rgba(11,30,54,.35);
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.band-slider__dot{
width:8px;height:8px;border-radius:50%;
background:rgba(245,239,227,.4);
transition:all var(--t);
padding:0;
}
.band-slider__dot:hover{background:rgba(245,239,227,.7)}
.band-slider__dot.is-active{background:var(--c-gold);width:24px;border-radius:var(--r-pill)}
@media (max-width:768px){
.band-slider{height:380px;min-height:0;max-height:none}
.image-band{height:380px}
.band-slider__arrow{width:42px;height:42px}
.band-slider__arrow--prev{left:12px}
.band-slider__arrow--next{right:12px}
.band-slider__caption{font-size:14px;padding:10px 18px}
.band-slider__dots{bottom:14px;padding:6px 12px}
}
@media (max-width:480px){
.band-slider{height:300px;min-height:0;max-height:none}
.image-band{height:300px}
.band-slider__slide{padding:24px 16px}
}
/* Parallax - przerywnik z efektem "zdjęcia przyklejonego do viewportu".
Trick: position:fixed na ![]()
+ clip-path:inset(0) na .parallax, dzięki
czemu fixed img jest "przyłapany" w bounds sekcji (trzymany tylko w jej
widocznej części). Działa na desktop + iOS, bez JS. */
.parallax{
height:420px;
background-color:var(--c-navy);
position:relative;
overflow:hidden;
clip-path:inset(0); /* tworzy containing block dla position:fixed */
display:flex;align-items:center;justify-content:center;
color:var(--c-cream);
text-align:center;
}
.parallax__bg{
position:fixed;top:0;left:0;z-index:0;
width:100vw;height:100vh;
object-fit:cover;object-position:center;
display:block;
}
.parallax__bg img{
width:100%;height:100%;
object-fit:cover;object-position:center;
display:block;
}
.parallax.fade-in,.parallax{opacity:1 !important;transform:none !important}
.parallax::after{
content:'';position:absolute;inset:0;
background:linear-gradient(to bottom,rgba(11,30,54,.55),rgba(11,30,54,.75));
}
/* Parallax bez tekstu - pokaż zdjęcie czysto, minimalne zaciemnienie */
.parallax--image-only::after{
background:linear-gradient(to bottom,rgba(11,30,54,.1),rgba(11,30,54,.25));
}
.parallax--image-only{height:380px}
@media (max-width:768px){
.parallax{height:320px}
.parallax--image-only{height:280px}
}
.parallax__inner{position:relative;z-index:2;max-width:700px;padding:0 32px}
.parallax__inner .eyebrow{margin-bottom:16px}
.parallax__inner p{
font:300 italic clamp(22px, 3vw, 32px)/1.4 var(--ff-serif);
margin-bottom:0;
}
.parallax__divider{height:1px;width:60px;background:var(--c-gold);margin:0 auto 24px}
/* Stats */
.stats{padding:80px 0;background:var(--c-cream);border-bottom:1px solid var(--c-border-dark)}
.stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center}
.stats__num{font:300 clamp(40px,5vw,64px)/1 var(--ff-serif);color:var(--c-navy);margin-bottom:12px}
.stats__num em{color:var(--c-gold);font-style:normal}
.stats__label{font:400 11px/1 var(--ff-sans);letter-spacing:3px;text-transform:uppercase;color:var(--c-navy);opacity:.7}
/* Amenities */
.amenities{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;max-width:1080px;margin:0 auto}
.amenity{text-align:center;padding:32px 16px;transition:transform .3s}
.amenity:hover{transform:translateY(-3px)}
.amenity__icon{
width:60px;height:60px;margin:0 auto 24px;
color:var(--c-gold);
stroke-width:1.5;
filter:drop-shadow(0 4px 12px rgba(185,195,218,.15));
}
.section--light .amenity__icon{color:var(--c-navy)}
.amenity__name{font:400 22px/1.2 var(--ff-serif);letter-spacing:-.3px;margin-bottom:8px}
.amenity__sub{font:400 11px/1 var(--ff-sans);letter-spacing:2.5px;text-transform:uppercase;color:var(--c-gold);opacity:.85}
.amenity p{font-size:13px;line-height:1.7;opacity:.75;margin-top:10px}
/* Types (apartment style cards) */
.types{display:grid;grid-template-columns:repeat(2,1fr);gap:48px}
.type-card{
background:var(--c-white);
border:1px solid var(--c-border-dark);
border-radius:var(--r);
transition:all .3s;
box-shadow:var(--shadow-card);
overflow:hidden;
display:flex;flex-direction:column;
}
.type-card:hover{border-color:var(--c-gold);transform:translateY(-3px);box-shadow:var(--shadow-card-hover)}
.type-card__plan{
position:relative;
background:linear-gradient(180deg,#f8f6f1 0%,#f0ece1 100%);
padding:24px;
border-bottom:1px solid var(--c-border-dark);
}
.type-card__plan-img{
width:100%;height:auto;display:block;
max-height:280px;object-fit:contain;
margin:0 auto;
}
.type-card__plan-img img{width:100%;height:auto;display:block;max-height:280px;object-fit:contain;margin:0 auto}
.type-card__plan-caption{
margin-top:12px;text-align:center;
font:400 11px/1 var(--ff-sans);letter-spacing:2px;
text-transform:uppercase;color:var(--c-gold-deep);opacity:.85;
}
.type-card__body{padding:36px 40px}
.type-card__label{font:400 11px/1 var(--ff-sans);letter-spacing:3px;text-transform:uppercase;color:var(--c-gold);margin-bottom:16px}
.type-card h3{font:400 34px/1.15 var(--ff-serif);margin-bottom:20px}
.type-card h3 em{color:var(--c-gold);font-weight:400}
.type-card p{font-size:14px;line-height:1.75;color:rgba(11,30,54,.75);margin-bottom:24px}
.type-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:24px;border-top:1px solid var(--c-border-dark)}
.type-spec__label{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--c-gold);margin-bottom:4px}
.type-spec__value{font:400 22px/1.2 var(--ff-serif)}
/* Two-col generic */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);align-items:center}
.two-col__image{aspect-ratio:4/5;background:#ccc;border-radius:var(--r);width:100%;height:auto;object-fit:cover;object-position:center;display:block;overflow:hidden}
.two-col__image img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;border-radius:inherit}
.two-col__content h2{text-align:left;margin:0 0 24px;font-size:44px}
.two-col__content p{font-size:15px;line-height:1.85;margin-bottom:20px;color:rgba(11,30,54,.78)}
.section--dark .two-col__content p{color:rgba(245,239,227,.82)}
.feature-list{list-style:none;margin-top:32px}
.feature-list li{
padding:14px 0 14px 32px;
position:relative;
font-size:15px;
border-bottom:1px solid var(--c-border-dark);
}
.feature-list li::before{content:'';position:absolute;left:0;top:24px;width:16px;height:1px;background:var(--c-gold)}
.section--dark .feature-list li{border-bottom-color:var(--c-border-light)}
/* Location - 2 kolumny: mapa lewa, POI prawa */
.location-layout{
display:grid;grid-template-columns:1.1fr 1fr;gap:48px;
align-items:stretch;margin-top:32px;
}
/* Mapa */
.location-map{
position:relative;
min-height:520px;
border-radius:var(--r);
overflow:hidden;
box-shadow:0 20px 60px rgba(0,0,0,.3);
border:1px solid var(--c-border-light);
}
.location-map iframe{
width:100%;height:100%;min-height:520px;
border:0;display:block;
filter:saturate(.85) contrast(1.02); /* delikatnie stonowana paleta */
}
.location-map__actions{
position:absolute;left:16px;bottom:16px;z-index:2;
display:flex;gap:8px;flex-wrap:wrap;
}
.location-map__link{
display:inline-flex;align-items:center;gap:8px;
padding:10px 16px;border-radius:var(--r-pill);
background:var(--c-navy);color:var(--c-gold);
font:400 11px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
border:1px solid var(--c-gold);
box-shadow:0 4px 16px rgba(0,0,0,.3);
transition:all var(--t);
}
.location-map__link:hover{background:var(--c-gold);color:var(--c-navy)}
.location-map__link svg{width:14px;height:14px}
/* Leaflet container - kanwa mapy */
.location-map__canvas{
width:100%;height:100%;min-height:520px;
background:#e0d9ca;
}
.location-map__canvas .leaflet-container{background:#e0d9ca}
/* Customowe markery Leaflet */
.map-marker{
position:relative;display:inline-flex;align-items:center;gap:4px;
pointer-events:none;
}
.map-marker__pin{
width:18px;height:18px;border-radius:50% 50% 50% 0;
background:var(--c-gold);border:2px solid var(--c-navy);
transform:rotate(-45deg);
box-shadow:0 3px 8px rgba(0,0,0,.3);
pointer-events:auto;
flex-shrink:0;
}
.map-marker__dot{
width:12px;height:12px;border-radius:50%;
background:var(--c-navy);border:2px solid var(--c-gold);
box-shadow:0 2px 6px rgba(0,0,0,.3);
pointer-events:auto;
flex-shrink:0;
}
.map-marker__label{
font:500 11px/1 var(--ff-sans);letter-spacing:.3px;
color:var(--c-navy);
padding:4px 8px;border-radius:3px;
background:rgba(255,255,255,.92);
border:1px solid rgba(11,30,54,.15);
box-shadow:0 2px 6px rgba(0,0,0,.15);
white-space:nowrap;
pointer-events:auto;
}
.map-marker--main .map-marker__label{
background:var(--c-navy);color:var(--c-gold);
font-weight:600;padding:6px 10px;
border-color:var(--c-gold);
font-size:12px;
}
/* Popup style - pasuje do motywu */
.leaflet-popup-content-wrapper{
border-radius:3px !important;
background:var(--c-cream-light) !important;
box-shadow:0 8px 24px rgba(0,0,0,.2) !important;
}
.leaflet-popup-content{
font:400 13px/1.5 var(--ff-sans) !important;
color:var(--c-navy) !important;
margin:12px 16px !important;
}
.leaflet-popup-content strong{color:var(--c-gold-deep);font-size:14px}
.leaflet-popup-tip{background:var(--c-cream-light) !important}
.leaflet-container a.leaflet-popup-close-button{color:var(--c-gold-deep) !important}
/* POI lista */
.location-poi{display:flex;flex-direction:column;gap:12px;min-height:520px}
.location-poi__label{
font:400 11px/1 var(--ff-sans);letter-spacing:3px;
text-transform:uppercase;color:var(--c-gold);
margin-bottom:8px;
}
.poi-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;flex:1}
.poi-item{
display:grid;grid-template-columns:84px 1fr;gap:20px;align-items:center;
padding:14px 20px;
background:rgba(11,30,54,.28);
border:1px solid var(--c-border-light);
border-left:3px solid var(--c-gold);
border-radius:var(--r);
transition:all .25s ease;
}
.poi-item:hover{
background:rgba(11,30,54,.5);
transform:translateX(4px);
border-left-color:var(--c-cream);
}
.poi-item__time{display:flex;align-items:baseline;gap:4px;justify-content:center}
.poi-item__number{font:300 38px/1 var(--ff-serif);color:var(--c-gold);letter-spacing:-1px}
.poi-item__unit{font:400 10px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;color:var(--c-gold);opacity:.8}
.poi-item__desc{font-size:14px;line-height:1.45;color:var(--c-cream);opacity:.9}
/* Adres - klikalny link do Google Maps */
.location-address{
text-align:center;margin-top:48px;padding-top:40px;
border-top:1px solid var(--c-border-light);
font:400 italic 20px/1.4 var(--ff-serif);opacity:.85;
}
.location-address a{
color:inherit;text-decoration:none;
display:inline-flex;align-items:center;gap:4px;
transition:color var(--t);
}
.location-address a:hover{color:var(--c-gold)}
.location-address a:hover svg{transform:translate(2px,-2px)}
.location-address a svg{color:var(--c-gold);transition:transform var(--t)}
.location-address strong{color:var(--c-gold);font-weight:400;font-style:normal}
@media (max-width:1024px){
.location-layout{grid-template-columns:1fr;gap:32px}
.location-map,.location-poi{min-height:auto}
.location-map iframe{min-height:380px}
}
@media (max-width:600px){
.poi-item{grid-template-columns:64px 1fr;gap:14px;padding:12px 16px}
.poi-item__number{font-size:30px}
.location-map iframe{min-height:300px}
.location-address{font-size:17px}
}
/* Gallery tabs + panele */
.gallery-tabs{
display:flex;gap:8px;justify-content:center;flex-wrap:wrap;
margin-bottom:48px;
padding:8px;
background:rgba(245,239,227,.05);
border:1px solid var(--c-border-light);
border-radius:var(--r-pill);
width:fit-content;margin-left:auto;margin-right:auto;
}
.gallery-tab{
display:inline-flex;align-items:center;gap:10px;
padding:12px 22px;border-radius:var(--r-pill);
font:400 12px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
color:var(--c-cream);opacity:.65;
transition:all var(--t);
min-height:44px;
}
.gallery-tab:hover{opacity:1}
.gallery-tab.is-active{background:var(--c-gold);color:var(--c-navy);opacity:1}
.gallery-tab__count{
display:inline-flex;align-items:center;justify-content:center;
min-width:24px;height:24px;padding:0 6px;border-radius:var(--r-pill);
background:rgba(245,239,227,.15);
font-size:11px;font-weight:500;letter-spacing:0;
}
.gallery-tab.is-active .gallery-tab__count{background:rgba(11,30,54,.15)}
/* Panele */
.gallery-panel[hidden]{display:none}
.gallery-panel{animation:galleryFade .3s ease}
@keyframes galleryFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* Gallery grid */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.gallery-item{
aspect-ratio:4/3;
border-radius:var(--r);
cursor:zoom-in;
transition:transform .4s ease;
position:relative;
overflow:hidden;
display:block;
}
.gallery-item img{
position:absolute;inset:0;
width:100%;height:100%;
object-fit:cover;object-position:center;
display:block;
}
.gallery-item.is-collapsed{display:none}
.gallery-panel.is-expanded .gallery-item.is-collapsed{display:block;animation:galleryFade .3s ease}
.gallery-more{text-align:center;margin-top:32px}
.gallery-more .btn{color:var(--c-cream);border-color:var(--c-border-light)}
.gallery-more .btn:hover{background:var(--c-gold);color:var(--c-navy);border-color:var(--c-gold)}
.gallery-item::after{
content:'';position:absolute;inset:0;
background:linear-gradient(to top,rgba(11,30,54,.3) 0%,transparent 50%);
opacity:0;transition:opacity .3s;
}
.gallery-item:hover{transform:scale(.98)}
.gallery-item:hover::after{opacity:1}
.lightbox{
position:fixed;inset:0;z-index:999;
background:rgba(8,20,40,.95);
display:none;align-items:center;justify-content:center;
padding:40px;
}
.lightbox.is-open{display:flex}
.lightbox__img{max-width:95vw;max-height:90vh;object-fit:contain;box-shadow:var(--shadow-modal)}
.lightbox__close,.lightbox__prev,.lightbox__next{
position:absolute;top:50%;transform:translateY(-50%);
color:var(--c-cream);
width:52px;height:52px;border-radius:50%;
background:rgba(11,30,54,.4);
display:flex;align-items:center;justify-content:center;
opacity:.85;transition:all var(--t);
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.lightbox__close svg,.lightbox__prev svg,.lightbox__next svg{width:22px;height:22px}
.lightbox__close{top:24px;right:24px;transform:none}
.lightbox__prev{left:24px}
.lightbox__next{right:24px}
.lightbox__close:hover,.lightbox__prev:hover,.lightbox__next:hover{opacity:1;color:var(--c-gold);background:rgba(11,30,54,.7)}
.lightbox__counter{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);font:400 12px/1 var(--ff-sans);letter-spacing:2px;color:var(--c-muted)}
/* Apartments: stats - 4 kafle, wartości dynamiczne wg filtrów */
.apt-stats{
display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:40px;
}
.apt-stat{
background:var(--c-white);padding:20px 24px;
border-radius:var(--r);border:1px solid var(--c-border-dark);
display:flex;flex-direction:column;gap:6px;
transition:transform .3s ease,box-shadow .3s ease;
}
.apt-stat__val{
font:300 34px/1 var(--ff-serif);color:var(--c-navy);
transition:color .3s ease;
display:inline-block;
}
.apt-stat__lbl{font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;text-transform:uppercase;color:var(--c-navy);opacity:.6}
.apt-stat--green .apt-stat__val{color:var(--c-green)}
.apt-stat--gold .apt-stat__val{color:var(--c-gold-deep)}
.apt-stat--muted .apt-stat__val{color:rgba(11,30,54,.4)}
/* Animacja pulse gdy wartość się zmienia (JS dodaje klasę na chwilę) */
@keyframes statPulse{
0%{transform:scale(1)}
30%{transform:scale(1.08)}
100%{transform:scale(1)}
}
.apt-stat--pulse{animation:statPulse .4s ease}
@media (prefers-reduced-motion:reduce){.apt-stat--pulse{animation:none}}
/* Apartments: filters */
.filters{display:flex;gap:40px;margin-bottom:40px;padding-bottom:32px;border-bottom:1px solid var(--c-border-dark);flex-wrap:wrap}
.filter-group{display:flex;flex-direction:column;gap:10px}
.filter-label{font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;color:var(--c-navy);text-transform:uppercase;opacity:.6}
.filter-options{display:flex;gap:8px;flex-wrap:wrap}
.filter-btn{
font:400 12px/1 var(--ff-sans);letter-spacing:1.5px;text-transform:uppercase;
padding:14px 20px;min-height:44px;
border:1px solid rgba(11,30,54,.2);
color:var(--c-navy);
border-radius:var(--r);
transition:all var(--t);
}
.filter-btn:hover{border-color:var(--c-gold);color:var(--c-gold)}
.filter-btn.is-active{background:var(--c-navy);color:var(--c-cream);border-color:var(--c-navy)}
/* Apartments: cards grid */
.apt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;transition:opacity .2s}
.apt-grid.is-loading{opacity:.5;pointer-events:none}
.apt-grid[data-view="table"]{
display:block;
overflow-x:auto;
-webkit-overflow-scrolling:touch;
/* Scroll affordance on the right edge hints "there's more →". */
background:linear-gradient(to right,transparent 0,transparent calc(100% - 20px),rgba(11,30,54,.12) 100%) no-repeat;
background-attachment:local;
}
.apt-grid[data-view="table"] .apt-card{display:none}
.apt-empty{
grid-column:1/-1;text-align:center;padding:80px 24px;
background:rgba(11,30,54,.03);border-radius:var(--r);
font:400 italic 20px/1.4 var(--ff-serif);color:rgba(11,30,54,.5);
}
/* Active filter chips - pokazują, jakie filtry są włączone */
.apt-active-filters{
display:flex;flex-wrap:wrap;align-items:center;gap:10px;
margin-bottom:28px;padding:16px 20px;
background:rgba(185,195,218,.08);
border-left:3px solid var(--c-gold);
border-radius:var(--r);
animation:chipFadeIn .25s ease;
}
.apt-active-filters[hidden]{display:none}
.apt-chip__label{
font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
text-transform:uppercase;color:var(--c-navy);opacity:.65;
margin-right:4px;
}
.apt-chip{
display:inline-flex;align-items:center;gap:8px;
padding:7px 10px 7px 14px;
background:var(--c-white);border:1px solid var(--c-border-dark);
border-radius:var(--r-pill);
font:400 12px/1 var(--ff-sans);color:var(--c-navy);
transition:all var(--t);
}
.apt-chip:hover{border-color:var(--c-gold);color:var(--c-gold-deep)}
.apt-chip__name{font-weight:400;letter-spacing:1px;text-transform:uppercase;font-size:10px;opacity:.6}
.apt-chip__value{font-weight:400;font-size:13px;letter-spacing:.3px}
.apt-chip__x{
display:inline-flex;align-items:center;justify-content:center;
width:20px;height:20px;border-radius:50%;
background:rgba(11,30,54,.08);font-size:14px;line-height:1;
margin-left:2px;
}
.apt-chip:hover .apt-chip__x{background:var(--c-gold);color:var(--c-white)}
.apt-chip--reset{
padding:7px 14px;background:transparent;border-style:dashed;border-color:var(--c-gold);
color:var(--c-gold-deep);letter-spacing:1.5px;text-transform:uppercase;font-size:11px;
}
.apt-chip--reset:hover{background:var(--c-gold);color:var(--c-white);border-style:solid}
@keyframes chipFadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* Paginacja kart apartamentów */
.apt-pagination{
display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:center;
margin:40px 0 0;padding:24px 0;
border-top:1px solid var(--c-border-dark);
}
.apt-pagination[hidden]{display:none}
.apt-pagination__btn{
display:inline-flex;align-items:center;gap:6px;
padding:10px 16px;min-height:44px;
border:1px solid rgba(11,30,54,.2);
background:transparent;color:var(--c-navy);border-radius:var(--r);
font:400 11px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
cursor:pointer;transition:all var(--t);
}
.apt-pagination__btn:hover:not(:disabled){border-color:var(--c-gold);color:var(--c-gold-deep)}
.apt-pagination__btn:disabled{opacity:.35;cursor:not-allowed}
.apt-pagination__btn svg{width:14px;height:14px}
.apt-pagination__numbers{display:flex;gap:4px}
.apt-pagination__page{
min-width:40px;height:40px;padding:0 10px;
border:1px solid rgba(11,30,54,.15);
background:var(--c-white);color:var(--c-navy);
border-radius:var(--r);cursor:pointer;
font:400 13px/1 var(--ff-sans);
transition:all var(--t);
}
.apt-pagination__page:hover{border-color:var(--c-gold);color:var(--c-gold-deep)}
.apt-pagination__page.is-active{
background:var(--c-navy);color:var(--c-cream);border-color:var(--c-navy);
}
.apt-pagination__info{
flex-basis:100%;text-align:center;
font:400 11px/1 var(--ff-sans);letter-spacing:1.5px;
color:var(--c-navy);opacity:.6;margin-top:8px;
}
@media (max-width:600px){
.apt-pagination{gap:8px}
.apt-pagination__btn{padding:10px 12px;font-size:10px;letter-spacing:1.5px}
.apt-pagination__btn span{display:none}
.apt-pagination__page{min-width:36px;height:36px;font-size:12px}
}
/* Empty state - gdy filtry nie zwracają wyników */
.apt-empty-state{
max-width:640px;margin:20px auto 0;
text-align:center;padding:56px 40px;
background:var(--c-white);
border:1px solid var(--c-border-dark);
border-radius:var(--r);
box-shadow:var(--shadow-card);
animation:chipFadeIn .3s ease;
}
.apt-empty-state[hidden]{display:none}
.apt-empty-state__icon{
width:56px;height:56px;margin:0 auto 20px;
color:var(--c-gold-deep);opacity:.75;
padding:12px;
background:rgba(185,195,218,.1);
border-radius:50%;
box-sizing:content-box;
}
.apt-empty-state__title{
font:300 26px/1.25 var(--ff-serif);letter-spacing:-.3px;
margin-bottom:14px;color:var(--c-navy);
}
.apt-empty-state__text{
max-width:440px;margin:0 auto 28px;
font-size:14px;line-height:1.7;color:rgba(11,30,54,.7);
}
.apt-empty-state__actions{
display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
}
.apt-empty-state__actions .btn{min-width:auto;padding:14px 24px;font-size:11px}
@media (max-width:768px){
.apt-empty-state{padding:40px 24px;margin-top:12px}
.apt-empty-state__title{font-size:22px}
.apt-empty-state__actions{flex-direction:column;align-items:stretch}
.apt-empty-state__actions .btn{width:100%}
}
/* Card */
.apt-card{
background:var(--c-white);
border:1px solid var(--c-border-dark);
border-radius:var(--r);
padding:24px;
display:flex;flex-direction:column;gap:16px;
transition:all .25s ease;
cursor:pointer;
box-shadow:var(--shadow-card);
}
.apt-card:hover{
border-color:var(--c-gold);
transform:translateY(-4px);
box-shadow:var(--shadow-card-hover);
}
.apt-card[data-status="sold"]{opacity:.6}
.apt-card__head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.apt-card__name{font:400 22px/1 var(--ff-serif);letter-spacing:.5px}
.apt-card__meta{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px}
.apt-card__meta > div{display:flex;flex-direction:column;gap:2px}
.apt-card__meta .label{font:400 9px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;color:var(--c-navy);opacity:.5}
.apt-card__meta .value{font:400 15px/1.2 var(--ff-sans);color:var(--c-navy)}
.apt-card__tags{display:flex;gap:6px;flex-wrap:wrap}
.apt-tag{
font:400 10px/1 var(--ff-sans);letter-spacing:1.5px;text-transform:uppercase;
padding:5px 10px;border-radius:var(--r);
background:rgba(11,30,54,.05);color:var(--c-navy);
}
.apt-tag--green{background:rgba(90,138,93,.1);color:var(--c-green)}
.apt-tag--gold{background:rgba(185,195,218,.15);color:var(--c-gold-deep)}
.apt-tag--finish{
background:linear-gradient(135deg,rgba(185,195,218,.2),rgba(185,195,218,.08));
color:var(--c-gold-deep);
border:1px solid rgba(185,195,218,.35);
display:inline-flex;align-items:center;
}
.apt-card__finish{
display:flex;justify-content:space-between;align-items:baseline;gap:10px;
margin-top:10px;padding:10px 12px;
background:linear-gradient(135deg,rgba(185,195,218,.12),rgba(185,195,218,.04));
border:1px solid rgba(185,195,218,.3);border-radius:var(--r);
}
.apt-card__finish-label{
font:400 10px/1.2 var(--ff-sans);letter-spacing:1.5px;
text-transform:uppercase;color:var(--c-gold-deep);opacity:.85;
}
.apt-card__finish-value{
font:400 17px/1 var(--ff-serif);color:var(--c-gold-deep);
letter-spacing:-.2px;font-style:italic;
}
/* Banner: wszystkie lokale wykończone - nad listą apartamentów */
.apt-finish-banner{
display:flex;align-items:center;gap:18px;
margin:0 0 28px;padding:18px 22px;
background:linear-gradient(135deg,rgba(185,195,218,.14),rgba(185,195,218,.04));
border:1px solid rgba(185,195,218,.32);border-radius:var(--r);
}
.apt-finish-banner__icon{
flex:none;width:42px;height:42px;border-radius:50%;
display:grid;place-items:center;
background:rgba(185,195,218,.22);color:var(--c-gold-deep);
}
.apt-finish-banner__icon svg{width:22px;height:22px}
.apt-finish-banner__title{
font:400 18px/1.25 var(--ff-serif);color:var(--c-navy);
letter-spacing:-.2px;margin-bottom:4px;
}
.apt-finish-banner__sub{
font:400 14px/1.55 var(--ff-sans);color:var(--c-navy);opacity:.78;
}
.apt-finish-banner__sub strong{color:var(--c-gold-deep);font-weight:500}
@media (max-width:640px){
.apt-finish-banner{flex-direction:column;align-items:flex-start;text-align:left}
}
/* Hero: badge "wykończone w standardzie" - pod CTA */
.hero__finish-badge{
display:inline-flex;align-items:center;gap:10px;
margin:0 0 32px;padding:10px 14px;max-width:100%;
background:rgba(185,195,218,.14);
border:1px solid rgba(185,195,218,.4);border-radius:var(--r);
font:400 13px/1.45 var(--ff-sans);color:var(--c-cream);
}
.hero__finish-badge svg{flex:none;width:16px;height:16px;color:var(--c-gold)}
.hero__finish-badge strong{color:var(--c-gold);font-weight:500}
/* Stopka karty apartamentu - cena u góry, przycisk karty lokalu na pełną szerokość */
.apt-card__foot{
display:flex;flex-direction:column;gap:14px;
padding-top:16px;border-top:1px solid var(--c-border-dark);
}
.apt-card__price-row{
display:flex;justify-content:space-between;align-items:baseline;gap:12px;
}
.apt-card__price-label{
font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
text-transform:uppercase;color:var(--c-navy);opacity:.5;
}
.apt-card__price{
font:400 24px/1 var(--ff-serif);color:var(--c-navy);
letter-spacing:-.3px;
}
.apt-card__ask{
display:inline-flex;align-items:center;gap:6px;
font:400 15px/1 var(--ff-serif);font-style:italic;
color:var(--c-gold-deep);
padding:4px 0;
border-bottom:1px dashed var(--c-gold);
transition:all var(--t);
}
.apt-card__ask svg{width:14px;height:14px;transition:transform var(--t)}
.apt-card__ask:hover{color:var(--c-navy);border-bottom-color:var(--c-navy)}
.apt-card__ask:hover svg{transform:translateX(3px)}
.apt-card__ask--inline{font-size:13px;padding:0;letter-spacing:0;font-style:normal;font-family:var(--ff-sans)}
/* Przycisk „Zobacz kartę lokalu" na pełną szerokość pod ceną */
.apt-card__pdf-btn{
display:flex;align-items:center;justify-content:center;gap:10px;
width:100%;padding:12px 16px;
background:transparent;
color:var(--c-navy);
border:1px solid var(--c-border-dark);
border-radius:var(--r);
font:400 12px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
transition:all var(--t);
min-height:44px;
}
.apt-card__pdf-btn svg{width:16px;height:16px;color:var(--c-gold-deep);transition:color var(--t)}
.apt-card__pdf-btn:hover{
background:var(--c-navy);color:var(--c-cream);border-color:var(--c-navy);
}
.apt-card__pdf-btn:hover svg{color:var(--c-gold)}
/* Apartments: table view */
.apt-table{width:100%;border-collapse:collapse;font:300 13px/1.5 var(--ff-sans);min-width:900px;background:var(--c-white);border-radius:var(--r)}
.apt-table thead tr{border-bottom:1px solid var(--c-navy)}
.apt-table th{text-align:left;padding:16px 12px;font-size:10px;letter-spacing:2.5px;color:var(--c-navy);text-transform:uppercase;font-weight:500;white-space:nowrap}
.apt-table th.-num,.apt-table th.-right{text-align:right}
.apt-table tbody tr{border-bottom:1px solid rgba(11,30,54,.08);transition:background var(--t);cursor:pointer}
.apt-table tbody tr:hover{background:rgba(185,195,218,.08)}
.apt-table td{padding:16px 12px;color:var(--c-navy);vertical-align:middle}
.apt-table td.-num{text-align:right;font:400 16px/1 var(--ff-serif);white-space:nowrap}
.apt-table td.-right{text-align:right}
.apt-table td.-muted{opacity:.6}
.apt-table td.-name{font-weight:400;font-size:14px;letter-spacing:1px}
.table-note{font-size:12px;color:rgba(11,30,54,.6);margin-top:24px;line-height:1.7}
/* Status badges */
.status{display:inline-block;font:500 10px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;padding:6px 12px;border-radius:var(--r);white-space:nowrap}
.status--available{background:rgba(90,138,93,.12);color:var(--c-green)}
.status--reserved{background:rgba(185,195,218,.2);color:var(--c-gold-deep)}
.status--sold{background:rgba(11,30,54,.08);color:rgba(11,30,54,.5);text-decoration:line-through}
/* ROI */
.roi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.roi-card{background:rgba(245,239,227,.04);border:1px solid var(--c-border-light);padding:40px 32px;border-radius:var(--r);transition:all .3s}
.roi-card:hover{border-color:var(--c-gold);background:rgba(245,239,227,.08);transform:translateY(-3px)}
.roi-card__num{font:300 56px/1 var(--ff-serif);color:var(--c-gold);margin-bottom:16px}
.roi-card__title{font:400 22px/1.2 var(--ff-serif);margin-bottom:12px}
.roi-card p{font-size:14px;line-height:1.7;opacity:.85}
/* Promo */
.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:40px;align-items:stretch}
.promo-card{background:var(--c-white);border-left:3px solid var(--c-gold);padding:36px 32px;border-radius:var(--r);transition:transform .3s;box-shadow:var(--shadow-card);position:relative}
.promo-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-card-hover)}
/* Wyróżniona karta (opcjonalna) */
.promo-card--featured{
background:linear-gradient(160deg,#0B1E36 0%,#142a4a 100%);
border-left:3px solid var(--c-gold);
color:var(--c-cream);
transform:translateY(-8px);
box-shadow:0 30px 70px rgba(11,30,54,.28),0 0 0 1px rgba(185,195,218,.3);
}
.promo-card--featured:hover{transform:translateY(-11px);box-shadow:0 36px 80px rgba(11,30,54,.34),0 0 0 1px rgba(185,195,218,.5)}
.promo-card__badge{
position:absolute;top:-12px;right:20px;
display:inline-flex;align-items:center;
padding:6px 12px;border-radius:var(--r-pill);
background:var(--c-gold);color:var(--c-navy);
font:500 10px/1 var(--ff-sans);letter-spacing:2px;
text-transform:uppercase;
box-shadow:0 6px 18px rgba(185,195,218,.4);
}
@media (max-width:900px){
.promo-card--featured{transform:none}
.promo-card--featured:hover{transform:translateY(-3px)}
}
.promo-card__tag{
display:inline-block;font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;text-transform:uppercase;
color:var(--c-gold);background:rgba(185,195,218,.1);padding:5px 10px;border-radius:var(--r);margin-bottom:16px;
}
.promo-card h3{font:400 24px/1.25 var(--ff-serif);margin-bottom:12px}
.promo-card p{font-size:14px;line-height:1.7;color:rgba(11,30,54,.75)}
.promo-card p strong{color:var(--c-gold-deep);font-weight:600}
/* Wyróżniona karta - kolory tekstu (po .promo-card p, więc cascade wygrywa) */
.promo-card--featured h3{color:var(--c-cream)}
.promo-card--featured p{color:rgba(245,239,227,.85)}
.promo-card--featured p strong{color:var(--c-gold)}
.promo-card--featured .promo-card__tag{color:var(--c-gold);background:rgba(185,195,218,.18)}
/* =============================================================
OPIEKUN INWESTYCJI - osobista karta Julii
============================================================= */
.opiekun{
display:grid;grid-template-columns:minmax(320px,440px) 1fr;
gap:64px;align-items:center;
}
/* Zdjęcie */
.opiekun__photo{
position:relative;
aspect-ratio:4/5;
border-radius:var(--r);
overflow:hidden;
box-shadow:0 20px 60px rgba(11,30,54,.18);
}
.opiekun__photo-img{
position:absolute;inset:0;
width:100%;height:100%;
object-fit:cover;object-position:center top;
transition:transform .8s ease;
display:block;
}
.opiekun__photo-img img{
width:100%;height:100%;
object-fit:cover;object-position:center top;
display:block;
}
.opiekun__photo:hover .opiekun__photo-img{transform:scale(1.04)}
.opiekun__photo::after{
content:'';position:absolute;inset:0;
background:linear-gradient(180deg,transparent 50%,rgba(11,30,54,.3) 100%);
}
.opiekun__photo-badge{
position:absolute;bottom:20px;left:20px;z-index:2;
display:inline-flex;align-items:center;gap:8px;
padding:8px 14px;border-radius:var(--r-pill);
background:rgba(11,30,54,.92);color:var(--c-gold);
font:400 10px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.opiekun__photo-badge svg{width:14px;height:14px}
/* Treść po prawej */
.opiekun__content h2{
text-align:left;margin:0 0 20px;
font-size:clamp(28px,3vw,40px);
}
.opiekun__content h2 em{color:var(--c-gold-deep);font-style:italic;font-weight:300}
.opiekun__bio{
font-size:16px;line-height:1.85;color:rgba(11,30,54,.78);
margin-bottom:32px;max-width:560px;
}
/* Mini statystyki */
.opiekun__stats{
display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
margin-bottom:40px;padding:24px 0;
border-top:1px solid var(--c-border-dark);
border-bottom:1px solid var(--c-border-dark);
max-width:560px;
}
.opiekun__stat{display:flex;flex-direction:column;gap:6px}
.opiekun__stat-val{
font:300 32px/1 var(--ff-serif);color:var(--c-gold-deep);
letter-spacing:-.3px;
}
.opiekun__stat-lbl{
font:400 10px/1.3 var(--ff-sans);letter-spacing:2px;
text-transform:uppercase;color:var(--c-navy);opacity:.65;
}
/* Karta kontaktowa */
.opiekun__card{
background:#fff;
border:1px solid var(--c-border-dark);
border-radius:var(--r);
padding:32px;
box-shadow:var(--shadow-card);
max-width:560px;
}
.opiekun__card-head{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--c-border-dark)}
.opiekun__card-name{font:400 20px/1.2 var(--ff-serif);color:var(--c-navy);margin-bottom:4px}
.opiekun__card-role{
font:400 11px/1.3 var(--ff-sans);letter-spacing:1.5px;
text-transform:uppercase;color:var(--c-gold-deep);
}
.opiekun__card-links{display:flex;flex-direction:column;gap:14px;margin-bottom:24px}
.opiekun__card-link{
display:flex;align-items:center;gap:16px;
padding:14px 16px;border-radius:var(--r);
background:var(--c-cream-light);
transition:all var(--t);color:var(--c-navy);
}
.opiekun__card-link:hover{background:var(--c-navy);color:var(--c-cream)}
.opiekun__card-link:hover .opiekun__card-ico{background:var(--c-gold);color:var(--c-navy)}
.opiekun__card-ico{
width:40px;height:40px;border-radius:50%;
background:var(--c-gold-deep);color:#fff;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;transition:all var(--t);
}
.opiekun__card-ico svg{width:18px;height:18px}
.opiekun__card-text{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.opiekun__card-small{
font:400 10px/1 var(--ff-sans);letter-spacing:2px;
text-transform:uppercase;opacity:.6;
}
.opiekun__card-big{
font:400 16px/1.2 var(--ff-serif);letter-spacing:.2px;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.opiekun__cta{width:100%;text-align:center}
@media (max-width:900px){
.opiekun{grid-template-columns:1fr;gap:36px}
.opiekun__photo{
display:block !important;
max-width:420px;width:100%;margin:0 auto;
aspect-ratio:4/5;
}
.opiekun__photo-img{
object-position:center 20% !important;
object-fit:cover !important;
display:block !important;
}
.opiekun__stats{grid-template-columns:1fr;gap:16px;padding:20px 0;max-width:none}
.opiekun__card{padding:24px;max-width:none}
}
/* Investor */
.investor{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);align-items:center}
.investor h2{text-align:left;margin:0 0 24px}
.investor p{font-size:15px;line-height:1.85;margin-bottom:20px}
.investor__achievement{margin-top:40px;padding:32px;background:rgba(11,30,54,.04);border-left:3px solid var(--c-gold)}
.investor__achievement-label{font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;color:var(--c-gold);text-transform:uppercase;margin-bottom:8px}
.investor__achievement-text{font:400 italic 18px/1.5 var(--ff-serif)}
.investor__image{aspect-ratio:4/5;background:#ccc;border-radius:var(--r);width:100%;height:auto;object-fit:cover;object-position:center;display:block;overflow:hidden}
.investor__image img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;border-radius:inherit}
/* Sekcja partnerska (nieużywana) */
.partner__header{text-align:center;max-width:760px;margin:0 auto 48px}
.partner__header .eyebrow{margin-bottom:14px}
.partner__header .partner__title{margin:0 0 18px}
.partner__header .partner__lead{max-width:none;margin:0 auto}
/* Slider partnerski (nieużywany, re-uses .band-slider) */
.band-slider--partner{
height:560px;min-height:0;max-height:none;
border-radius:var(--r);
margin:0 0 56px;
box-shadow:0 20px 60px rgba(11,30,54,.2);
}
.band-slider--partner .band-slider__slide::after{
background:linear-gradient(to bottom,rgba(11,30,54,0) 0%,rgba(11,30,54,0) 60%,rgba(11,30,54,.35) 100%);
}
@media (max-width:900px){
.band-slider--partner{height:380px}
}
@media (max-width:480px){
.band-slider--partner{height:300px}
}
.partner{display:grid;grid-template-columns:1.4fr 1fr;gap:64px;align-items:center;padding:32px 0}
.partner__title{font:300 clamp(28px,3.4vw,40px)/1.15 var(--ff-serif);letter-spacing:-.5px;margin:18px 0 18px;color:var(--c-navy)}
.partner__title em{font-style:italic;color:var(--c-gold-deep);font-weight:300}
.partner__lead{font-size:15px;line-height:1.85;color:rgba(11,30,54,.78);margin-bottom:24px;max-width:540px}
.partner__features{list-style:none;padding:0;margin:0 0 28px}
.partner__features li{position:relative;padding:8px 0 8px 28px;font-size:14px;line-height:1.6;color:rgba(11,30,54,.85)}
.partner__features li::before{content:'';position:absolute;left:0;top:18px;width:16px;height:1px;background:var(--c-gold-deep)}
.partner__link{display:inline-flex;align-items:center;font:400 12px/1 var(--ff-sans);letter-spacing:2.5px;text-transform:uppercase;padding:14px 24px;border:1px solid var(--c-navy);color:var(--c-navy);border-radius:var(--r);transition:all var(--t)}
.partner__link:hover{background:var(--c-navy);color:var(--c-cream);transform:translateY(-1px)}
.partner__brand{background:var(--c-navy);color:var(--c-cream);padding:48px 32px;border-radius:var(--r);text-align:center;box-shadow:0 20px 60px rgba(11,30,54,.18)}
.partner__logo-box{display:flex;align-items:center;justify-content:center;padding-bottom:28px;margin-bottom:24px;border-bottom:1px solid rgba(185,195,218,.25)}
.partner__logo-img{width:100%;max-width:240px;height:auto;display:block}
.partner__quote{font:300 italic 16px/1.5 var(--ff-serif);color:var(--c-cream);opacity:.85;max-width:280px;margin:0 auto}
@media (max-width:900px){
.partner{grid-template-columns:1fr;gap:36px;text-align:center}
.partner__features{text-align:left;max-width:420px;margin-left:auto;margin-right:auto}
.partner__features li{padding-left:24px}
}
/* Quote - logo po lewej, cytat po prawej */
.quote-section{padding:var(--gap-xl) 0}
.quote-wrap{
display:flex;flex-direction:row;align-items:center;justify-content:center;gap:56px;
max-width:1000px;margin:0 auto;
}
.quote-logo{
width:220px;height:220px;border-radius:50%;overflow:hidden;
box-shadow:0 20px 60px rgba(11,30,54,.25);
flex-shrink:0;
}
.quote-logo img{width:100%;height:100%;display:block}
.quote{
font:300 italic clamp(22px,2.8vw,34px)/1.4 var(--ff-serif);
max-width:640px;margin:0;color:var(--c-navy);
text-align:left;
position:relative;
padding-left:32px;
}
.quote::before{
content:'';position:absolute;left:0;top:8px;bottom:8px;
width:2px;background:var(--c-gold);
display:block;
}
.quote::after{display:none}
@media (max-width:768px){
.quote-wrap{flex-direction:column;text-align:center;gap:28px}
.quote-logo{width:120px;height:120px}
.quote{text-align:center;padding-left:0;padding-top:24px}
.quote::before{left:50%;top:0;bottom:auto;transform:translateX(-50%);width:40px;height:1px}
}
/* FAQ */
.faq{max-width:880px;margin:0 auto}
.faq__item{border-bottom:1px solid var(--c-border-dark);padding:28px 0}
.faq__q{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;cursor:pointer;font:400 22px/1.35 var(--ff-serif);color:var(--c-navy);list-style:none}
.faq__q::after{content:'+';font:300 28px/1 var(--ff-serif);color:var(--c-gold);flex-shrink:0;transition:transform var(--t)}
.faq__item[open] .faq__q::after{content:'-'}
.faq__a{padding-top:16px;font-size:15px;line-height:1.8;color:rgba(11,30,54,.78);max-width:720px}
/* Contact */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-lg);align-items:start}
.contact__info h2{text-align:left;margin:0 0 32px;font-size:44px}
.contact__info p{font-size:15px;line-height:1.75;opacity:.88;margin-bottom:40px}
.contact-person{
display:flex;gap:0;align-items:stretch;
border-radius:var(--r);
background:var(--c-cream-light);
overflow:hidden;
box-shadow:0 8px 30px rgba(0,0,0,.2);
color:var(--c-navy);
}
.contact-person__avatar{
width:280px;flex-shrink:0;
background:#5a2a1c;
border:0;
min-height:340px;
align-self:stretch;
display:block;
object-fit:cover;
object-position:center top;
}
.contact-person__body{padding:28px 32px;display:flex;flex-direction:column;gap:14px;flex:1;justify-content:center}
.contact-person__name{font:400 20px/1.2 var(--ff-serif);color:var(--c-navy);margin:0}
.contact-person__name strong{font-weight:600}
.contact-person__sep{color:var(--c-gold);font-weight:300;margin:0 4px}
.contact-person__role-inline{font-weight:400;opacity:.75}
.contact-person__link{
display:inline-flex;align-items:center;gap:12px;
color:var(--c-navy);font:400 15px/1 var(--ff-sans);
transition:color var(--t);
}
.contact-person__link:hover{color:var(--c-gold-deep)}
.contact-person__ico{
width:38px;height:38px;border-radius:50%;
background:var(--c-gold-deep);color:var(--c-white);
display:inline-flex;align-items:center;justify-content:center;
flex-shrink:0;
transition:background var(--t);
}
.contact-person__ico svg{width:16px;height:16px}
.contact-person__link:hover .contact-person__ico{background:var(--c-gold)}
/* Klauzula administratora danych */
.form__req{color:var(--c-error)}
.form__gdpr{
margin-top:20px;padding-top:20px;
border-top:1px solid var(--c-border-dark);
font-size:11px;line-height:1.6;color:rgba(11,30,54,.5);
}
.form{background:var(--c-cream);color:var(--c-navy);padding:48px;border-radius:var(--r);box-shadow:var(--shadow-card-hover)}
.form h3{font:400 28px/1.2 var(--ff-serif);margin-bottom:28px}
.form__field{margin-bottom:20px}
.form__field label{display:block;font:400 10px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;color:var(--c-navy);opacity:.7;margin-bottom:8px}
.form__field input,.form__field textarea,.form__field select{
width:100%;padding:12px 14px;
border:1px solid rgba(11,30,54,.15);background:transparent;
font:300 14px/1.5 var(--ff-sans);color:var(--c-navy);
border-radius:var(--r);transition:border-color var(--t);
}
.form__field input:focus,.form__field textarea:focus,.form__field select:focus{outline:0;border-color:var(--c-gold)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form__check{display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.5;color:rgba(11,30,54,.7);margin-bottom:12px}
.form__check input{margin-top:3px;flex-shrink:0}
.form__submit{width:100%;padding:16px;background:var(--c-navy);color:var(--c-cream);font:400 12px/1 var(--ff-sans);letter-spacing:3px;text-transform:uppercase;margin-top:16px;border-radius:var(--r);transition:all var(--t)}
.form__submit:hover{background:var(--c-gold);color:var(--c-navy)}
.form__notice{padding:12px 16px;border-radius:var(--r);margin-bottom:16px;font-size:13px}
.form__notice--ok{background:rgba(90,138,93,.12);color:var(--c-green);border:1px solid rgba(90,138,93,.2)}
.form__notice--err{background:rgba(139,58,58,.1);color:var(--c-error);border:1px solid rgba(139,58,58,.25)}
/* AJAX form messages - wspólny styl dla obu formularzy (hero + contact) */
.form-msg{
display:flex;align-items:flex-start;gap:12px;
padding:14px 16px;border-radius:var(--r);
margin-top:16px;
font:400 13px/1.45 var(--ff-sans);
border:1px solid transparent;
opacity:0;transform:translateY(-4px);
transition:opacity .25s ease,transform .25s ease;
}
.form-msg.is-visible{opacity:1;transform:none}
.form-msg__ico{flex-shrink:0;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center}
.form-msg__ico svg{width:20px;height:20px}
.form-msg__text{flex:1;padding-top:1px}
.form-msg--ok{background:rgba(90,138,93,.12);color:#3a6b3d;border-color:rgba(90,138,93,.3)}
.form-msg--ok .form-msg__ico{color:#5a8a5d}
.form-msg--err{background:rgba(180,70,70,.08);color:#8b3a3a;border-color:rgba(180,70,70,.25)}
.form-msg--err .form-msg__ico{color:#b44646}
/* Wariant na ciemnym tle (hero form) */
.hero-form .form-msg--ok{background:rgba(120,180,125,.18);color:#cfe8d2;border-color:rgba(120,180,125,.35)}
.hero-form .form-msg--ok .form-msg__ico{color:#9fdba6}
.hero-form .form-msg--err{background:rgba(220,140,140,.15);color:#f3c4c4;border-color:rgba(220,140,140,.3)}
.hero-form .form-msg--err .form-msg__ico{color:#f0a0a0}
/* Footer */
.footer{background:var(--c-navy-deep);color:var(--c-cream);padding:72px 0 32px;border-top:1px solid var(--c-border-light)}
.footer__main{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:56px;padding-bottom:48px;border-bottom:1px solid var(--c-border-light)}
.footer__logo{max-width:320px}
.footer__logo svg,.footer__logo-img,.footer__logo .custom-logo{
width:80px;height:80px;margin-bottom:20px;
border-radius:50%;
box-shadow:0 4px 20px rgba(0,0,0,.3);
}
.footer__logo p{font-size:13px;line-height:1.7;opacity:.75;margin-bottom:20px}
.footer__social{display:flex;gap:10px;align-items:center}
.footer__social a{
width:48px;height:48px;
border:1px solid rgba(185,195,218,.35);border-radius:50%;
background:rgba(185,195,218,.08);color:var(--c-gold);
transition:all var(--t);
overflow:hidden;
/* Absolute centering - bulletproof */
position:relative;
display:inline-block;
font-size:0; line-height:0;
}
.footer__social a:hover{
background:var(--c-gold);border-color:var(--c-gold);color:var(--c-navy);
transform:translateY(-2px);box-shadow:0 6px 18px rgba(185,195,218,.3);
}
.footer__social svg{
width:22px;height:22px;
position:absolute;
top:50%;left:50%;
transform:translate(-50%,-50%);
display:block;
}
.footer__col h4{font:400 10px/1 var(--ff-sans);letter-spacing:3px;text-transform:uppercase;color:var(--c-gold);margin-bottom:20px}
.footer__col a{display:block;font-size:13px;color:var(--c-cream);opacity:.8;padding:5px 0;transition:all var(--t)}
.footer__col a:hover{opacity:1;color:var(--c-gold)}
.footer__bottom{
padding-top:28px;
display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;
font:400 11px/1.4 var(--ff-sans);letter-spacing:1.5px;color:var(--c-muted);
}
.footer__bottom-left{text-align:left}
.footer__bottom-center{text-align:center}
.footer__bottom-right{text-align:right}
.footer__bottom a{color:var(--c-muted);transition:color var(--t)}
.footer__bottom a:hover{color:var(--c-gold)}
.footer__bottom-right a{color:var(--c-cream);font-weight:400}
.footer__bottom-right a:hover{color:var(--c-gold)}
@media (max-width:768px){
.footer__bottom{grid-template-columns:1fr;text-align:center}
.footer__bottom-left,.footer__bottom-right{text-align:center}
}
/* Contact CTA strip (kompaktowa sekcja po liście mieszkań) */
.contact-cta{padding:80px 0}
.contact-cta__inner{
display:grid;grid-template-columns:1fr auto;gap:var(--gap-lg);align-items:center;
padding:56px 64px;
background:linear-gradient(135deg,rgba(185,195,218,.1) 0%,rgba(185,195,218,.02) 100%);
border:1px solid var(--c-border-light);
border-radius:var(--r);
}
.contact-cta__title{font:300 clamp(28px,4vw,44px)/1.15 var(--ff-serif);margin:12px 0 20px}
.contact-cta__title em{color:var(--c-gold);font-style:italic;font-weight:300}
.contact-cta__lead{font-size:15px;line-height:1.7;opacity:.82;max-width:520px}
.contact-cta__actions{display:flex;flex-direction:column;gap:20px;align-items:flex-end}
.contact-cta__phone{
display:flex;flex-direction:column;gap:4px;align-items:flex-end;text-align:right;
padding:18px 28px;border:1px solid var(--c-gold);border-radius:var(--r);
transition:all var(--t);
}
.contact-cta__phone:hover{background:var(--c-gold);color:var(--c-navy)}
.contact-cta__phone-label{font:400 10px/1.2 var(--ff-sans);letter-spacing:2.5px;text-transform:uppercase;color:var(--c-gold);opacity:.9}
.contact-cta__phone:hover .contact-cta__phone-label{color:var(--c-navy);opacity:.7}
.contact-cta__phone-number{font:400 30px/1.1 var(--ff-serif);letter-spacing:.5px}
.contact-cta__buttons{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
/* Floating CTA - prawy dolny róg, numer z Customizera */
.floating-call{
position:fixed;bottom:24px;right:24px;z-index:50;
background:var(--c-gold);color:var(--c-navy);
padding:12px 20px 12px 12px;border-radius:var(--r-pill);
box-shadow:0 10px 30px rgba(11,30,54,.28),0 0 0 0 rgba(185,195,218,.7);
display:inline-flex;align-items:center;gap:14px;
transition:all var(--t);
animation:floatPulse 2.4s ease-in-out infinite;
}
.floating-call:hover{background:var(--c-navy);color:var(--c-gold);animation-play-state:paused}
.floating-call.is-hidden{
opacity:0;pointer-events:none;
transform:translateY(20px) scale(.9);
transition:all .3s ease;
}
.floating-call__icon{
width:40px;height:40px;border-radius:50%;
background:rgba(11,30,54,.12);color:var(--c-navy);
display:flex;align-items:center;justify-content:center;flex-shrink:0;
transition:all var(--t);
}
.floating-call:hover .floating-call__icon{background:rgba(185,195,218,.2);color:var(--c-gold)}
.floating-call__icon svg{width:18px;height:18px}
.floating-call__text{display:flex;flex-direction:column;gap:2px;text-align:left;line-height:1}
.floating-call__label{font:400 9px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;opacity:.75}
.floating-call__number{font:400 16px/1 var(--ff-serif);letter-spacing:.3px;white-space:nowrap}
@keyframes floatPulse{
0%,100%{box-shadow:0 10px 30px rgba(11,30,54,.28),0 0 0 0 rgba(185,195,218,.6)}
50%{box-shadow:0 10px 30px rgba(11,30,54,.28),0 0 0 14px rgba(185,195,218,0)}
}
@media (prefers-reduced-motion:reduce){.floating-call{animation:none}}
/* =============================================================
MODAL - premium szczegóły apartamentu z podglądem PDF
Dwukolumnowy layout: lewa (szczegóły + CTA), prawa (podgląd PDF)
============================================================= */
.modal{
position:fixed;inset:0;z-index:200;
display:none;
align-items:center;justify-content:center;
padding:24px;
}
.modal.is-open{display:flex}
.modal__backdrop{position:absolute;inset:0;background:rgba(8,20,40,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.modal__dialog{
position:relative;
width:min(1040px,100%);
max-height:92vh;
background:var(--c-cream-light);
border-radius:var(--r);
box-shadow:var(--shadow-modal);
overflow:hidden;
animation:modalIn .35s cubic-bezier(.16,1,.3,1);
}
@keyframes modalIn{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
.modal__close{
position:absolute;top:16px;right:16px;z-index:10;
width:48px;height:48px;border-radius:50%;
background:var(--c-navy);color:var(--c-gold);
border:2px solid var(--c-gold);
display:flex;align-items:center;justify-content:center;
transition:all var(--t);padding:0;
box-shadow:0 6px 20px rgba(11,30,54,.35);
}
.modal__close svg{width:22px;height:22px;stroke-width:2.2}
.modal__close:hover{
background:var(--c-gold);color:var(--c-navy);
transform:rotate(90deg) scale(1.05);
box-shadow:0 8px 24px rgba(185,195,218,.4);
}
/* 2-kolumnowy layout - lewa szczegóły, prawa PDF */
.modal__layout{display:grid;grid-template-columns:minmax(300px,380px) 1fr;min-height:560px;max-height:92vh;overflow:hidden}
/* Lewa kolumna - szczegóły */
.modal__side{
padding:40px 36px 32px;
background:var(--c-cream-light);
display:flex;flex-direction:column;gap:0;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
border-right:1px solid var(--c-border-dark);
}
.modal__brand{width:56px;height:56px;margin-bottom:28px;border-radius:50%;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.1)}
.modal__brand img,.modal__brand svg{width:100%;height:100%;display:block}
.modal__eyebrow{
font:400 10px/1 var(--ff-sans);letter-spacing:3.5px;
text-transform:uppercase;color:var(--c-gold-deep);
margin-bottom:10px;
}
.modal__title{
font:300 44px/1 var(--ff-serif);
color:var(--c-navy);letter-spacing:-.5px;
margin:0 0 18px;
}
/* Status badge row */
.modal__status-row{margin-bottom:28px}
.modal__status-row .status{font-size:11px;padding:7px 14px;letter-spacing:2.5px}
/* Lista specyfikacji */
.modal__specs{
list-style:none;padding:0;margin:0 0 28px;
border-top:1px solid var(--c-border-dark);
}
.modal__specs li{
display:grid;
grid-template-columns:28px 1fr auto;
align-items:center;gap:14px;
padding:14px 0;
border-bottom:1px solid var(--c-border-dark);
}
.modal__spec-ico{color:var(--c-gold-deep);display:flex;align-items:center;justify-content:center}
.modal__spec-ico svg{width:18px;height:18px}
.modal__spec-label{
font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
text-transform:uppercase;color:var(--c-navy);opacity:.6;
}
.modal__spec-value{
font:400 15px/1.2 var(--ff-sans);color:var(--c-navy);
letter-spacing:.3px;
}
/* Blok cenowy */
.modal__price-block{
margin-bottom:24px;padding:20px 24px;
background:rgba(185,195,218,.08);
border-left:3px solid var(--c-gold);
border-radius:var(--r);
}
.modal__price-label{
font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
text-transform:uppercase;color:var(--c-gold-deep);
margin-bottom:6px;
}
.modal__price{
font:300 32px/1.1 var(--ff-serif);color:var(--c-navy);
letter-spacing:-.3px;
}
/* Przyciski akcji */
.modal__actions{display:flex;flex-direction:column;gap:10px;margin-top:auto}
.modal__actions .btn{width:100%;justify-content:center;display:flex;align-items:center}
/* Prawa kolumna - PDF preview */
.modal__preview{
background:linear-gradient(180deg,#1a2a44 0%,#0d1726 100%);
display:flex;flex-direction:column;
min-height:560px;
}
.modal__preview-label{
padding:16px 24px;
font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
text-transform:uppercase;color:var(--c-gold);
display:flex;align-items:center;
border-bottom:1px solid rgba(185,195,218,.15);
}
.modal__pdf{
flex:1;width:100%;border:0;background:#2a2a2a;
min-height:500px;
}
@media (max-width:960px){
.modal{padding:0}
.modal__dialog{max-height:100vh;width:100%;border-radius:0;overflow-y:auto}
.modal__layout{grid-template-columns:1fr;min-height:auto;max-height:none;overflow:visible}
.modal__side{padding:64px 24px 28px;border-right:0;border-bottom:1px solid var(--c-border-dark);overflow:visible}
.modal__brand{width:42px;margin-bottom:20px}
.modal__title{font-size:34px}
.modal__preview{min-height:auto}
.modal__pdf{height:55vh;min-height:340px}
}
/* Page / 404 - UWAGA: używamy `article.page` (NIE samego `.page`),
bo WordPress dodaje klasę `page` do i bez specyficzności łapałoby body! */
article.page{background:var(--c-cream);min-height:60vh}
.page__header{padding-top:48px}
.page__header{text-align:center;margin-bottom:48px}
.page__title{font:300 52px/1.1 var(--ff-serif);letter-spacing:-1px;margin-bottom:16px}
.page__content{max-width:760px;margin:0 auto;font-size:16px;line-height:1.9}
.page__content h2{font:400 32px/1.2 var(--ff-serif);margin:40px 0 16px}
.page__content h3{font:400 24px/1.2 var(--ff-serif);margin:32px 0 12px}
.page__content p,.page__content ul,.page__content ol{margin-bottom:20px}
.page__content ul,.page__content ol{padding-left:24px}
.page__content a{color:var(--c-gold-deep);border-bottom:1px solid var(--c-gold)}
.error-404{text-align:center;padding:120px 24px;background:var(--c-cream)}
.error-404__code{font:300 clamp(100px,20vw,220px)/1 var(--ff-serif);color:var(--c-gold);letter-spacing:-6px;margin-bottom:16px}
.error-404__title{font:400 clamp(28px,3vw,44px)/1.2 var(--ff-serif);margin-bottom:16px}
.error-404__text{max-width:520px;margin:0 auto 40px;font-size:16px;line-height:1.7;opacity:.8}
/* Inline menu from wp_nav_menu (primary) */
.nav__list{display:contents}
/* -- 05 UTILITIES --------------------------------------------- */
.is-hidden{display:none !important}
.no-scroll{overflow:hidden}
/* Fade-in WYŁĄCZONY - teksty zawsze widoczne.
Fade-in z opacity:0 okazał się zbyt ryzykowny:
- przy fatal error w PHP → sekcje nie renderowały się i zostawały niewidoczne
- przy opóźnionym JS (WP Rocket delay) → identycznie
- luksusowa strona = niezawodne wyświetlanie tekstu, ważniejsze niż animacja.
Animacja kart apartamentów zostaje (tylko one pojawiają się z animacją). */
.fade-in{opacity:1 !important;transform:none !important}
/* -- 06 RESPONSIVE -------------------------------------------- */
@media (max-width:1024px){
.container{padding:0 32px}
.section{padding:90px 0}
.section-header h2{font-size:44px}
.hero{padding:72px 0 60px}
.hero__grid{grid-template-columns:1fr;gap:36px}
.hero__form-wrap{max-width:480px;margin:0 auto;justify-self:center}
.two-col,.investor,.contact{grid-template-columns:1fr;gap:56px}
.two-col__image,.investor__image{aspect-ratio:16/10}
.amenities,.location-grid,.apt-stats{grid-template-columns:repeat(2,1fr);gap:24px}
.gallery-grid{grid-template-columns:repeat(3,1fr)}
.stats__grid{grid-template-columns:repeat(2,1fr);gap:48px}
.roi-grid,.promo-grid,.types{grid-template-columns:1fr;gap:24px}
.footer__main{grid-template-columns:1fr 1fr;gap:40px}
.parallax{height:340px}
}
@media (max-width:768px){
.container{padding:0 20px}
.infobar{font-size:10px;letter-spacing:1.5px}
.infobar a{display:block;margin:4px 0}
/* Mobile nav - luksusowe, pełnoekranowe menu */
.nav{
display:flex;flex-direction:column;
position:fixed;inset:0;top:0;
background:linear-gradient(180deg,var(--c-navy) 0%,var(--c-navy-deep) 100%);
padding:0;gap:0;
z-index:99;
opacity:0;visibility:hidden;
transform:translateY(-12px);
transition:opacity .3s ease,transform .3s ease,visibility .3s;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
}
.nav.is-open{opacity:1 !important;visibility:visible !important;transform:none !important;display:flex !important}
/* Nagłówek mobilny - tytuł nad linkami */
.nav__mobile-header{
display:block;padding:96px 28px 32px;
border-bottom:1px solid var(--c-border-light);
}
.nav__mobile-eyebrow{
font:400 10px/1 var(--ff-sans);letter-spacing:3.5px;
color:var(--c-gold);text-transform:uppercase;margin-bottom:12px;
}
.nav__mobile-title{
font:300 28px/1.15 var(--ff-serif);
color:var(--c-cream);letter-spacing:-.3px;
}
/* Grupa linków */
.nav__links{
display:flex;flex-direction:column;
padding:16px 0;flex:1;
}
.nav a{
display:flex;align-items:center;gap:20px;
padding:20px 28px;
font:300 26px/1.2 var(--ff-serif);
letter-spacing:.3px;text-transform:none;
color:var(--c-cream);
border-bottom:1px solid rgba(245,239,227,.05);
transition:all var(--t);
}
.nav a:hover,.nav a.is-active{
background:rgba(185,195,218,.08);
color:var(--c-gold);
padding-left:36px;
}
.nav__num{
display:inline-block;
font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
color:var(--c-gold);opacity:.65;
min-width:24px;
}
.nav__label{flex:1}
/* CTA link - wyróżniony na dole listy */
.nav__cta,.nav .menu-item-cta a{
border:0;padding:20px 28px;
background:rgba(185,195,218,.06);
border-top:1px solid var(--c-gold);border-bottom:1px solid var(--c-gold);
border-radius:0;
margin-top:8px;
}
.nav__cta .nav__label{color:var(--c-gold)}
.nav__cta:hover{background:var(--c-gold);color:var(--c-navy) !important;padding-left:36px}
.nav__cta:hover .nav__label{color:var(--c-navy)}
.nav__cta:hover .nav__num{color:rgba(11,30,54,.6)}
/* Stopka menu - kontakt */
.nav__mobile-footer{
display:block;padding:32px 28px 40px;
background:rgba(8,20,40,.6);
border-top:1px solid var(--c-border-light);
}
.nav__contact-label{
font:400 10px/1 var(--ff-sans);letter-spacing:3px;
color:var(--c-gold);text-transform:uppercase;margin-bottom:16px;
}
.nav__contact-phone,.nav__contact-mail{
display:flex;align-items:center;gap:14px;
padding:14px 0;
font:400 15px/1 var(--ff-sans);color:var(--c-cream);
border-bottom:1px solid rgba(245,239,227,.06);
letter-spacing:.3px;
}
.nav__contact-phone:hover,.nav__contact-mail:hover{padding-left:0;background:transparent;color:var(--c-gold)}
.nav__contact-phone svg,.nav__contact-mail svg{
width:18px;height:18px;color:var(--c-gold);flex-shrink:0;
}
.nav__social{display:flex;gap:10px;margin-top:20px}
.nav__social a{
width:48px;height:48px;padding:0;border-radius:50%;
background:rgba(185,195,218,.12);border:1px solid rgba(185,195,218,.4);
color:var(--c-gold);
/* Absolute centering - bulletproof, identycznie jak footer__social */
position:relative;display:inline-block;
font-size:0;line-height:0;
overflow:hidden;
transition:all var(--t);
}
.nav__social a:hover{background:var(--c-gold);border-color:var(--c-gold);color:var(--c-navy);padding-left:0;transform:translateY(-2px)}
.nav__social svg{
width:22px;height:22px;display:block;
position:absolute;top:50%;left:50%;
transform:translate(-50%,-50%);
transition:color var(--t);
}
.burger{display:block;z-index:101;position:relative}
/* Blokuj scroll tła gdy menu otwarte */
body.no-scroll-menu{overflow:hidden}
.hero{padding:64px 0 80px}
.hero h1{font-size:40px;line-height:1.05}
.hero__lead{font-size:15px}
.hero__meta{gap:28px;padding-top:24px}
.meta__value{font-size:22px}
.btn{padding:14px 24px;font-size:11px;letter-spacing:2.5px}
.image-band{height:320px}
.parallax{height:260px}
.section{padding:64px 0}
.section-header{margin-bottom:48px}
.section-header h2{font-size:32px;line-height:1.15}
.stats{padding:48px 0}
.stats__grid{gap:32px}
.stats__num{font-size:44px}
.amenities,.location-grid,.apt-stats{grid-template-columns:1fr;gap:16px}
.location-item{padding:32px 20px}
.location-item__time{font-size:52px}
.gallery-grid{grid-template-columns:1fr 1fr;gap:6px}
.two-col__content h2,.investor h2,.contact__info h2{font-size:30px}
.type-card__body{padding:28px 24px}
.type-card__plan{padding:18px}
.type-card__plan-img,.type-card__plan-img img{max-height:220px}
.type-card h3{font-size:26px}
.type-spec__value{font-size:18px}
.apt-grid{grid-template-columns:1fr}
.apt-card__meta{grid-template-columns:repeat(2,1fr)}
.filters{gap:18px;margin-bottom:24px;padding-bottom:20px}
.form{padding:32px 24px}
.form__row{grid-template-columns:1fr;gap:0 16px}
.contact-person{flex-direction:column;padding:0}
.contact-person__avatar{
width:100%;height:auto;aspect-ratio:4/5;min-height:0;
max-height:480px;
}
.contact-person__avatar img{
object-position:center 20% !important;
}
.contact-person__body{padding:24px}
.quote{font-size:22px}
.faq__q{font-size:18px}
.footer__main{grid-template-columns:1fr;gap:36px;padding-bottom:32px}
.floating-call{bottom:16px;right:16px;padding:10px 16px 10px 10px;gap:10px}
.floating-call__icon{width:34px;height:34px}
.floating-call__icon svg{width:16px;height:16px}
.floating-call__number{font-size:14px}
.floating-call__label{font-size:8px;letter-spacing:1.5px}
.contact-cta{padding:56px 0}
.contact-cta__inner{grid-template-columns:1fr;gap:32px;padding:36px 28px;text-align:center}
.contact-cta__lead{margin:0 auto}
.contact-cta__actions{align-items:stretch}
.contact-cta__phone{align-items:center;text-align:center}
.contact-cta__buttons{justify-content:center}
.modal__dialog{max-height:100vh;border-radius:0}
.modal{padding:0}
.modal__header{padding:24px 20px 16px}
.modal__footer{padding:16px 20px}
.modal__pdf{height:55vh;min-height:300px}
}
/* Landscape orientation on small phones - PDF needs less vertical space. */
@media (max-width:900px) and (orientation:landscape){
.modal__pdf{height:50vh;min-height:200px}
.modal__header{padding:16px 20px 12px}
.modal__title{font-size:22px;margin-bottom:6px}
}
/* Intermediate breakpoint: smooths 375-600px (iPhone SE / 14 Pro / Android phones). */
@media (max-width:600px){
.gallery-grid{grid-template-columns:1fr;gap:8px}
.apt-grid{grid-template-columns:1fr;gap:16px}
.apt-card{padding:22px}
.contact__info h2{font-size:26px}
.section-header h2{font-size:28px}
.hero h1{font-size:38px}
.nav a{padding:12px 0} /* meets 44px touch target with line-height */
/* Na naprawdę wąskich ekranach floating pokazuje tylko ikonę - oszczędza miejsce. */
.floating-call__text{display:none}
.floating-call{padding:10px;border-radius:50%}
.floating-call__icon{background:transparent}
}
@media (max-width:480px){
.hero h1{font-size:36px}
.section-header h2{font-size:26px}
.quote{font-size:20px}
.logo__text strong{font-size:12px;letter-spacing:3px}
.logo__text{font-size:9px;letter-spacing:2px}
.apt-card{padding:20px}
.filter-btn{padding:12px 14px;font-size:11px} /* still 44px min-height */
}
@media (prefers-reduced-motion:reduce){
*{animation:none !important;transition:none !important}
html{scroll-behavior:auto}
}
/* =============================================================
WCAG AA CONTRAST OVERRIDES
-------------------------------------------------------------
Złoto #B9C3DA na kremowym/białym daje tylko 2.05:1 (fail AA).
Na jasnych tłach używamy ciemniejszego --c-gold-deep (#4E5FA0 = 4.65:1).
Ciemne sekcje zachowują oryginalne jasne złoto (kontrast z granatem 7.3:1).
============================================================= */
/* Stats - liczby złote na kremowym tle */
.stats__num em{color:var(--c-gold-deep)}
/* Typy apartamentów (białe karty na kremowym) */
.type-card__label,
.type-card h3 em,
.type-spec__label{color:var(--c-gold-deep)}
/* Sekcja promocji (beżowe tło) */
.section--beige .eyebrow,
.promo-card__tag{color:var(--c-gold-deep)}
/* Inwestor (jasne tło) */
.section--light .investor__achievement-label{color:var(--c-gold-deep)}
.investor__achievement-text em{color:var(--c-gold-deep)}
/* FAQ (kremowe tło) */
.faq__q::after,
.faq__a a{color:var(--c-gold-deep)}
/* Kontakt - kremowa wizytówka */
.contact-person__sep{color:var(--c-gold-deep)}
/* H2 em na jasnych tłach - tytuły sekcji na kremie/świetle */
.section--light .section-header h2 em,
.section--cream .section-header h2 em,
.section--beige .section-header h2 em{color:var(--c-gold-deep)}
/* Footer bottom - ciemniej dla czytelności na navy-deep */
.footer__bottom{color:rgba(245,239,227,.75)}
.footer__bottom a{color:rgba(245,239,227,.75)}
/* GDPR klauzula - była .5 opacity, to dawało 3.2:1, podbijam do .72 */
.form__gdpr{color:rgba(11,30,54,.72);font-size:11.5px}
/* Error / required - stonowany terracotta, nie jaskrawy czerwony */
.form__req{color:var(--c-error)}
.form__notice--err{color:var(--c-error);background:rgba(139,58,58,.08);border-color:rgba(139,58,58,.25)}
.contact-person__ico{background:var(--c-gold-deep)}
.contact-person__link:hover .contact-person__ico{background:var(--c-navy)}
/* Placeholder kolor dla obrazów - wcześniej #ccc */
.two-col__image,.investor__image{background-color:var(--c-placeholder)}
/* ===== Galileo - kosmiczne akcenty =====================================
Subtelna, elegancka warstwa "pod gwiazdami". Wszystkie akcenty są
dekoracyjne: position:absolute, pointer-events:none i siedzą ZA treścią
(z-index:0). Sekcje, które ich używają, muszą mieć position:relative
oraz podnosić własne .container do z-index:2 (patrz reguły niżej).
UMOWA UŻYCIA .section-stars:
Wariant .section-stars--dense = gęstsze pole gwiazd (na pasy hero-like).
Akcenty punktowe: .cosmic-orbit (cienka złota elipsa) oraz .cosmic-star
(mały 4-ramienny błysk) do narożnych akcentów.
====================================================================== */
/* Sekcje z akcentami muszą pozycjonować dzieci względem siebie i wynieść
treść ponad dekoracje. */
.drone,
.news,
.stars-band{position:relative;overflow:hidden}
.drone > .container,
.news > .container,
.stars-band > .container{position:relative;z-index:2}
/* --- Pole gwiazd (pure-CSS) --- */
.section-stars{
position:absolute;inset:0;z-index:0;
pointer-events:none;
opacity:.25;
background-repeat:no-repeat;
/* Kilka warstw radial-gradient jako rozproszone, przygaszone gwiazdy. */
background-image:
radial-gradient(1.5px 1.5px at 12% 18%, rgba(245,239,227,.9) 50%, transparent 51%),
radial-gradient(1px 1px at 28% 42%, rgba(245,239,227,.7) 50%, transparent 51%),
radial-gradient(1.5px 1.5px at 46% 12%, rgba(185,195,218,.9) 50%, transparent 51%),
radial-gradient(1px 1px at 63% 30%, rgba(245,239,227,.7) 50%, transparent 51%),
radial-gradient(1.5px 1.5px at 78% 20%, rgba(245,239,227,.85) 50%, transparent 51%),
radial-gradient(1px 1px at 88% 48%, rgba(185,195,218,.8) 50%, transparent 51%),
radial-gradient(1px 1px at 18% 72%, rgba(245,239,227,.7) 50%, transparent 51%),
radial-gradient(1.5px 1.5px at 38% 84%, rgba(245,239,227,.85) 50%, transparent 51%),
radial-gradient(1px 1px at 58% 66%, rgba(185,195,218,.75) 50%, transparent 51%),
radial-gradient(1px 1px at 72% 88%, rgba(245,239,227,.7) 50%, transparent 51%),
radial-gradient(1.5px 1.5px at 92% 78%, rgba(245,239,227,.85) 50%, transparent 51%);
}
.section-stars--dense{opacity:.32}
/* Migoczące klastry - tworzone box-shadow na dwóch drobnych pseudo-punktach,
żeby uzyskać "twinkle" bez dodatkowych elementów. */
.section-stars::before,
.section-stars::after{
content:'';position:absolute;width:2px;height:2px;border-radius:50%;
background:transparent;
}
.section-stars::before{
top:24%;left:34%;
box-shadow:
40px 60px 0 0 rgba(245,239,227,.9),
120px 20px 0 0 rgba(185,195,218,.8),
220px 90px 0 0 rgba(245,239,227,.75),
340px 40px 0 0 rgba(245,239,227,.85),
460px 110px 0 0 rgba(185,195,218,.7),
600px 30px 0 0 rgba(245,239,227,.8);
animation:galileoTwinkle 4.5s ease-in-out infinite;
}
.section-stars::after{
top:58%;left:12%;
box-shadow:
80px 30px 0 0 rgba(245,239,227,.8),
200px 70px 0 0 rgba(245,239,227,.7),
300px 10px 0 0 rgba(185,195,218,.8),
420px 60px 0 0 rgba(245,239,227,.85),
560px 20px 0 0 rgba(245,239,227,.75),
680px 80px 0 0 rgba(185,195,218,.7);
animation:galileoTwinkleSlow 6.5s ease-in-out infinite;
}
@keyframes galileoTwinkle{
0%,100%{opacity:1}
45%{opacity:.35}
70%{opacity:.85}
}
@keyframes galileoTwinkleSlow{
0%,100%{opacity:.85}
50%{opacity:.3}
}
/* --- Cienka złota orbita (elipsa) --- */
.cosmic-orbit{
position:absolute;z-index:0;pointer-events:none;
top:-140px;right:-160px;
width:520px;height:280px;
border:1px solid rgba(185,195,218,.28);
border-radius:50%;
transform:rotate(-18deg);
opacity:.35;
}
.cosmic-orbit::after{
content:'';position:absolute;
top:50%;left:50%;
width:340px;height:180px;
margin:-90px 0 0 -170px;
border:1px solid rgba(185,195,218,.18);
border-radius:50%;
}
/* --- Mała 4-ramienna gwiazda (glif) - narożny akcent --- */
.cosmic-star{
position:absolute;z-index:0;pointer-events:none;
width:44px;height:44px;opacity:.28;
background:
radial-gradient(closest-side, rgba(185,195,218,.9), transparent 70%);
}
.cosmic-star::before,
.cosmic-star::after{
content:'';position:absolute;top:50%;left:50%;
background:linear-gradient(var(--c-gold-soft),transparent);
transform:translate(-50%,-50%);
}
/* dwa cienkie promienie tworzące błysk 4-ramienny */
.cosmic-star::before{width:1.5px;height:44px;background:linear-gradient(180deg,transparent,var(--c-gold),transparent)}
.cosmic-star::after{width:44px;height:1.5px;background:linear-gradient(90deg,transparent,var(--c-gold),transparent)}
.cosmic-star--tl{top:48px;left:40px}
.cosmic-star--br{bottom:48px;right:56px;width:30px;height:30px;opacity:.2}
.cosmic-star--br::before{height:30px}
.cosmic-star--br::after{width:30px}
/* --- Reduced motion: żadnych animacji akcentów --- */
@media (prefers-reduced-motion:reduce){
.section-stars::before,
.section-stars::after{animation:none}
}
/* ===== Sekcja: Z lotu ptaka (#z-lotu) ================================= */
.drone__grid{
display:grid;grid-template-columns:0.9fr 1.1fr;gap:var(--gap-md);
align-items:center;
}
.drone__title{
font:300 clamp(32px,4.4vw,52px)/1.1 var(--ff-serif);
letter-spacing:-1px;margin:14px 0 24px;
}
.drone__title em{font-style:italic;color:var(--c-gold);font-weight:300}
.drone__lead{font-size:16px;line-height:1.8;opacity:.85;max-width:460px}
.drone-frame{
position:relative;border-radius:var(--r);overflow:hidden;
border:1px solid var(--c-border-light);
box-shadow:0 30px 70px rgba(0,0,0,.45);
background:var(--c-navy-deep);
}
/* responsywny 16:9 iframe */
.drone-frame__video{position:relative;width:100%;aspect-ratio:16/9}
.drone-frame__video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* still z drona jako ![]()
object-fit cover + overlay play */
.drone-frame__still{display:block;position:relative;aspect-ratio:16/9}
.drone-frame__img{width:100%;height:100%;object-fit:cover;display:block}
.drone-frame__still::after{
content:'';position:absolute;inset:0;
background:linear-gradient(to top,rgba(8,20,40,.75),transparent 55%);
pointer-events:none;
}
.drone-frame__play{
position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
z-index:2;
width:80px;height:80px;border-radius:50%;
display:flex;align-items:center;justify-content:center;
background:rgba(185,195,218,.92);color:var(--c-navy);
box-shadow:0 8px 30px rgba(0,0,0,.4);
transition:transform .25s ease,background .25s ease;
}
.drone-frame__play svg{width:30px;height:30px;margin-left:4px}
.drone-frame__still:hover .drone-frame__play{transform:translate(-50%,-50%) scale(1.08);background:var(--c-gold-soft)}
.drone-frame__caption{
position:absolute;left:20px;bottom:16px;z-index:2;
font:400 11px/1.4 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
color:var(--c-cream);opacity:.9;
}
/* pasek miniatur pod głównym kadrem */
.drone__thumbs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.drone__thumb{
display:block;aspect-ratio:16/10;overflow:hidden;border-radius:var(--r);
border:1px solid var(--c-border-light);
}
.drone__thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.drone__thumb:hover img{transform:scale(1.06)}
/* ===== Sekcja: Dziennik budowy (#dziennik-budowy) ==================== */
.news-grid{
display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap-sm);
}
.news-card{
display:flex;flex-direction:column;
background:var(--c-navy-mid);
border:1px solid var(--c-border-light);border-radius:var(--r);
overflow:hidden;
transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.news-card:hover{
transform:translateY(-4px);
box-shadow:0 24px 50px rgba(0,0,0,.4);
border-color:rgba(185,195,218,.45);
}
.news-card__media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden}
.news-card__img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.news-card:hover .news-card__img{transform:scale(1.06)}
.news-card__date{
position:absolute;top:12px;left:12px;
background:rgba(8,20,40,.85);color:var(--c-gold);
font:400 11px/1 var(--ff-sans);letter-spacing:1.5px;
padding:7px 10px;border-radius:var(--r);
border:1px solid var(--c-border-light);
}
.news-card__body{
display:flex;flex-direction:column;gap:10px;
padding:22px 22px 24px;flex:1;
}
.news-card__title{
font:300 22px/1.25 var(--ff-serif);color:var(--c-cream);letter-spacing:-.3px;
}
.news-card__excerpt{
font-size:14px;line-height:1.6;opacity:.8;flex:1;
}
.news-card__more{
font:400 11px/1 var(--ff-sans);letter-spacing:2px;text-transform:uppercase;
color:var(--c-gold);margin-top:6px;
transition:letter-spacing .25s ease;
}
.news-card:hover .news-card__more{letter-spacing:3px}
/* ===== Sekcja: Osiedle pod gwiazdami (#pod-gwiazdami) ================= */
.stars-band{
background:radial-gradient(120% 140% at 50% 0%,var(--c-navy) 0%,var(--c-navy-deep) 100%);
color:var(--c-cream);text-align:center;
padding:var(--gap-lg) 0;
}
.stars-band__inner{max-width:760px;margin:0 auto;position:relative}
.stars-band__title{
font:300 clamp(30px,4.2vw,48px)/1.15 var(--ff-serif);
letter-spacing:-1px;margin:14px 0 20px;
}
.stars-band__title em{font-style:italic;color:var(--c-gold);font-weight:300}
.stars-band__text{font-size:16px;line-height:1.85;opacity:.85;margin:0 auto;max-width:620px}
/* ===== Kosmiczne sekcje - RESPONSIVE ================================= */
@media (max-width:900px){
.drone__grid{grid-template-columns:1fr;gap:var(--gap-sm)}
.drone__lead{max-width:none}
.news-grid{grid-template-columns:1fr 1fr}
.cosmic-orbit{display:none}
}
@media (max-width:600px){
.news-grid{grid-template-columns:1fr}
.drone__thumbs{grid-template-columns:1fr 1fr}
.drone-frame__play{width:64px;height:64px}
.drone-frame__play svg{width:24px;height:24px}
.cosmic-star{display:none}
}
/* ===== Galileo - deep-link / scroll polish (playbook 06) ===== */
/* Kotwice (#domy, #lokalizacja, #kontakt…) mają lądować pod sticky .topbar,
nie chować się pod nim. .topbar to jedyny sticky element (~82px). */
[id]{ scroll-margin-top: 96px; }
@media (max-width:768px){ [id]{ scroll-margin-top: 78px; } }
/* Reveal-safe: sekcja otwarta z deep-linku (:target) MUSI być widoczna,
nawet gdy animacja fade-in jeszcze nie zdążyła się odpalić. */
[id]:target{ opacity:1 !important; transform:none !important; }
.reveal:target, .fade-in:target, .is-inview:target{ opacity:1 !important; transform:none !important; }
/* Guard przeciw poziomemu scrollowi na mobile (dekoracyjne akcenty kosmiczne
są position:absolute wewnątrz sekcji overflow:hidden, ale dokładamy pas). */
html{ overflow-x:clip; }
/* ===== Galileo - gwiazdy w tle ciemnych sekcji (globalnie) ===== */
.section--dark{position:relative}
.section--dark > .container{position:relative;z-index:1}
.section--dark::before{
content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
background-image:
radial-gradient(1.4px 1.4px at 12% 22%, rgba(245,239,227,.55), transparent),
radial-gradient(1px 1px at 28% 68%, rgba(185,195,218,.5), transparent),
radial-gradient(1.6px 1.6px at 46% 34%, rgba(245,239,227,.45), transparent),
radial-gradient(1px 1px at 63% 78%, rgba(245,239,227,.4), transparent),
radial-gradient(1.3px 1.3px at 78% 26%, rgba(185,195,218,.5), transparent),
radial-gradient(1px 1px at 90% 60%, rgba(245,239,227,.42), transparent),
radial-gradient(1px 1px at 55% 14%, rgba(245,239,227,.4), transparent);
opacity:.5;
}
/* ===== Cosmic quote band ===== */
.quote-section--cosmic{
position:relative;overflow:hidden;
background:var(--c-navy-deep);
padding:clamp(72px,10vw,140px) 0;
text-align:center;
}
.quote-section__bg{
position:absolute;inset:0;width:100%;height:100%;
object-fit:cover;opacity:.55;z-index:0;
}
.quote-section--cosmic::after{ /* winieta, by tekst czytelny */
content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
background:radial-gradient(ellipse at center, rgba(8,20,40,.35) 0%, rgba(8,20,40,.82) 78%);
}
.quote-section--cosmic .container{position:relative;z-index:3}
.quote-section--cosmic .section-stars{z-index:2}
.quote-wrap{max-width:820px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:26px}
.quote-logo{display:flex;flex-direction:column;align-items:center;gap:10px}
.quote-logo img{display:block}
.quote-logo__main{width:auto;max-width:260px;height:auto;filter:brightness(0) invert(1) drop-shadow(0 2px 10px rgba(0,0,0,.5))}
.quote-logo__wordmark{font:300 40px/1 var(--ff-serif);color:var(--c-cream);letter-spacing:1px}
.quote-section--cosmic .quote{
font:300 clamp(26px,3.6vw,44px)/1.35 var(--ff-serif);
color:var(--c-cream);margin:0;text-wrap:balance;
}
.quote-section--cosmic .quote br{display:block}
.quote-sub{
font:400 12px/1.4 var(--ff-sans);letter-spacing:3px;text-transform:uppercase;
color:var(--c-gold);opacity:.9;
}
/* ===== Finansowanie - lewa: ekspertka, prawa: 3 karty ===== */
.finansowanie{position:relative;overflow:hidden}
.fin-layout{
display:grid;grid-template-columns:minmax(300px,360px) 1fr;gap:40px;align-items:start;
margin-top:8px;
}
.fin-offer{
background:linear-gradient(160deg,var(--c-navy) 0%,var(--c-navy-deep) 100%);
color:var(--c-cream);border-radius:6px;padding:32px 28px;text-align:center;
border:1px solid var(--c-border-light);box-shadow:var(--shadow-card);
position:sticky;top:96px;
}
.fin-offer__photo{width:132px;height:132px;margin:0 auto 18px;border-radius:50%;overflow:hidden;
border:3px solid var(--c-gold);box-shadow:0 8px 30px rgba(0,0,0,.35)}
.fin-offer__img{width:100%;height:100%;object-fit:cover;display:block}
.fin-offer__badge{display:inline-block;font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;
text-transform:uppercase;color:var(--c-navy-deep);background:var(--c-gold);
padding:6px 12px;border-radius:40px;margin-bottom:14px}
.fin-offer__name{font:300 26px/1.1 var(--ff-serif);color:var(--c-cream)}
.fin-offer__role{font:400 11px/1.4 var(--ff-sans);letter-spacing:1.5px;text-transform:uppercase;
color:var(--c-gold);margin-top:4px}
.fin-offer__text{font:300 15px/1.7 var(--ff-sans);color:var(--c-muted);margin:16px 0 22px}
.fin-offer__text strong{color:var(--c-cream);font-weight:500}
.fin-offer__cta{display:flex;flex-direction:column;gap:12px;align-items:center}
.fin-offer__cta .btn{width:100%;justify-content:center;gap:8px}
.fin-offer__cta .btn svg{width:17px;height:17px}
.fin-offer__mail{font:400 13px/1.4 var(--ff-sans);color:var(--c-gold);word-break:break-all;
border-bottom:1px solid transparent;transition:border-color var(--t)}
.fin-offer__mail:hover{border-color:var(--c-gold)}
.fin-cards{display:flex;flex-direction:column;gap:18px}
.fin-cards .promo-card{margin:0}
.promo-card__ico{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;
border-radius:50%;background:rgba(185,195,218,.12);color:var(--c-gold-deep);margin-bottom:12px}
.promo-card__ico svg{width:22px;height:22px}
@media (max-width:860px){
.fin-layout{grid-template-columns:1fr;gap:28px}
.fin-offer{position:static;max-width:420px;margin:0 auto}
}
/* Location - adres w panelu POI + przycisk mapy */
.location-address{display:flex;align-items:center;gap:10px;margin-top:22px;
font:400 15px/1.5 var(--ff-sans);color:var(--c-muted)}
.location-address a{color:var(--c-cream);border-bottom:1px solid var(--c-border-light);transition:border-color var(--t)}
.location-address a:hover{border-color:var(--c-gold)}
.location-map{position:relative}
.location-map__link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;
font:400 13px/1 var(--ff-sans);letter-spacing:1px;text-transform:uppercase;color:var(--c-gold)}
.location-map__link svg{width:16px;height:16px}
/* ===== Galileo - ruchomy kosmos w tle ciemnych sekcji ===== */
.section--dark{overflow:hidden}
.section--dark::before{inset:-15%;animation:galileoDrift 80s ease-in-out infinite alternate}
.section--dark::after{
content:"";position:absolute;inset:-15%;z-index:0;pointer-events:none;opacity:.5;
background-image:
radial-gradient(circle at 18% 30%, transparent 96px, rgba(185,195,218,.07) 98px, transparent 101px),
radial-gradient(circle at 82% 68%, transparent 140px, rgba(185,195,218,.06) 142px, transparent 145px),
radial-gradient(1px 1px at 35% 55%, rgba(245,239,227,.5), transparent),
radial-gradient(1.4px 1.4px at 68% 20%, rgba(185,195,218,.55), transparent),
radial-gradient(1px 1px at 8% 75%, rgba(245,239,227,.45), transparent),
radial-gradient(1.2px 1.2px at 92% 40%, rgba(245,239,227,.5), transparent);
animation:galileoDrift 120s ease-in-out infinite alternate-reverse, galileoTwinkleLayer 7s ease-in-out infinite;
}
@keyframes galileoDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(2.5%,1.8%,0)}}
@keyframes galileoTwinkleLayer{0%,100%{opacity:.5}50%{opacity:.32}}
/* Wiecej kosmosu w galerii, dzienniku i lokalizacji */
#galeria::before,#dziennik-budowy::before,#lokalizacja::before,.team::before{opacity:.75}
#galeria::after,#dziennik-budowy::after,#lokalizacja::after,.team::after{opacity:.8}
.cosmic-drift{animation:galileoDrift 90s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){
.section--dark::before,.section--dark::after,.cosmic-drift{animation:none !important}
}
/* ===== Naglowek wysrodkowany ===== */
.section-header--center{text-align:center;max-width:760px;margin-left:auto;margin-right:auto}
.section-header--center .intro{margin-left:auto;margin-right:auto}
/* ===== Inwestor - naglowek + timeline ===== */
.investor__head{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:center;margin-bottom:64px}
.investor__head h2{margin-bottom:18px}
.investor__head p{font:300 16px/1.75 var(--ff-sans);color:rgba(11,30,54,.78);margin-bottom:14px}
.investor__logo{display:flex;justify-content:center;align-items:center;padding:24px;
background:var(--c-white);border:1px solid var(--c-border-dark);border-radius:8px;box-shadow:var(--shadow-card)}
.investor__logo-img{max-width:100%;height:auto;max-height:120px;display:block}
.timeline{position:relative;display:flex;gap:0;padding:80px 0;overflow-x:auto;scroll-snap-type:x proximity}
.timeline::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;
background:linear-gradient(90deg,transparent,var(--c-gold) 8%,var(--c-gold) 92%,transparent)}
.timeline__item{position:relative;flex:0 0 240px;scroll-snap-align:center;display:flex;justify-content:center}
.timeline__dot{position:absolute;top:50%;left:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;
background:var(--c-navy-accent);border:3px solid var(--c-white);box-shadow:0 0 0 3px var(--c-gold);z-index:2}
.timeline__card{position:relative;width:200px;background:var(--c-white);border:1px solid var(--c-border-dark);
border-radius:8px;padding:16px 18px;box-shadow:var(--shadow-card)}
.timeline__item.is-top .timeline__card{margin-bottom:120px}
.timeline__item.is-bottom .timeline__card{margin-top:120px}
.timeline__card::after{content:"";position:absolute;left:50%;width:2px;height:52px;background:var(--c-gold);margin-left:-1px}
.timeline__item.is-top .timeline__card::after{top:100%}
.timeline__item.is-bottom .timeline__card::after{bottom:100%}
.timeline__year{display:block;font:300 30px/1 var(--ff-serif);color:var(--c-navy-accent);margin-bottom:8px}
.timeline__desc{display:block;font:300 13px/1.55 var(--ff-sans);color:rgba(11,30,54,.72)}
@media (max-width:900px){
.investor__head{grid-template-columns:1fr;gap:24px}
.investor__logo{max-width:320px}
/* Timeline pionowy na telefonie */
.timeline{flex-direction:column;gap:0;padding:20px 0;overflow:visible}
.timeline::before{left:20px;right:auto;top:0;bottom:0;width:2px;height:auto}
.timeline__item{flex:none;width:100%;justify-content:flex-start;padding-left:52px;margin-bottom:26px}
.timeline__dot{left:20px;top:24px}
.timeline__card{width:100%;max-width:none}
.timeline__item.is-top .timeline__card,.timeline__item.is-bottom .timeline__card{margin:0}
.timeline__card::after{display:none}
}
/* ===== Zespol - karty z hover overlay ===== */
.team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,320px));gap:40px;justify-content:center;margin-top:8px}
.team-card{text-align:center}
.team-card__photo{position:relative;aspect-ratio:4/5;border-radius:10px;overflow:hidden;
box-shadow:0 18px 50px rgba(0,0,0,.35);border:1px solid var(--c-border-light)}
.team-card__img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;
transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s}
.team-card__overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
gap:12px;padding:26px 22px;text-align:left;
background:linear-gradient(0deg,rgba(8,20,40,.94) 0%,rgba(8,20,40,.7) 45%,rgba(8,20,40,0) 100%);
opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}
.team-card__overlay p{font:300 15px/1.65 var(--ff-sans);color:var(--c-cream);margin:0}
.team-card__brand{font:400 10px/1 var(--ff-sans);letter-spacing:2.5px;text-transform:uppercase;color:var(--c-gold)}
.team-card:hover .team-card__img,.team-card:focus-within .team-card__img{transform:scale(1.06)}
.team-card:hover .team-card__overlay,.team-card:focus-within .team-card__overlay{opacity:1;transform:none}
.team-card__info{padding:20px 6px 0}
.team-card__name{font:300 25px/1.15 var(--ff-serif);color:var(--c-cream)}
.team-card__role{font:400 11px/1.4 var(--ff-sans);letter-spacing:1.5px;text-transform:uppercase;color:var(--c-gold);margin-top:4px}
.team-card__contact{display:flex;flex-direction:column;gap:6px;margin-top:14px;align-items:center}
.team-card__phone{display:inline-flex;align-items:center;gap:8px;font:500 17px/1 var(--ff-sans);color:var(--c-cream)}
.team-card__phone svg{width:16px;height:16px;color:var(--c-gold)}
.team-card__mail{font:400 13px/1.4 var(--ff-sans);color:var(--c-gold);word-break:break-all}
@media (max-width:640px){ .team-grid{grid-template-columns:minmax(0,340px)} .team-card__overlay{opacity:1;transform:none;position:static;background:rgba(8,20,40,.5);border-radius:0 0 10px 10px} }
/* ===== Logo custom (poziomy wordmark) - naglowek/stopka/preloader ===== */
.logo .custom-logo{width:auto !important;height:44px !important;max-height:48px;border-radius:0 !important;
overflow:visible !important;box-shadow:none !important;object-fit:contain;
filter:brightness(0) invert(1) drop-shadow(0 1px 4px rgba(0,0,0,.4))}
.logo__brand{display:block;font:300 26px/1 var(--ff-serif);color:var(--c-cream);letter-spacing:.5px}
.footer__logo .custom-logo{height:52px !important;width:auto !important;filter:brightness(0) invert(1)}
.preloader .custom-logo{height:56px;width:auto;filter:brightness(0) invert(1)}
/* ===== Sticky topbar "ruchomy" - stan po przewinieciu ===== */
.topbar{transition:padding .3s ease,background .3s ease,box-shadow .3s ease}
.topbar.is-scrolled{padding:4px 0;background:rgba(8,20,40,.97);box-shadow:0 6px 24px rgba(0,0,0,.28)}
.topbar.is-scrolled .logo svg,.topbar.is-scrolled .logo img.logo__mark,.topbar.is-scrolled .logo .custom-logo{transform:scale(.9)}
/* ===== FAQ - 2 kolumny na desktopie (nizsza sekcja) ===== */
@media (min-width:860px){
.faq{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;align-items:start}
}
/* ===== Gwiazdy jako punktory list (osiedle pod gwiazdami) ===== */
.feature-list{list-style:none;padding:0;margin:0}
.feature-list li{position:relative;padding-left:32px;margin-bottom:14px;font:300 16px/1.6 var(--ff-sans)}
.feature-list li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23B9C3DA'%3E%3Cpath d='M12 2l2.1 7.9L22 12l-7.9 2.1L12 22l-2.1-7.9L2 12l7.9-2.1z'/%3E%3C/svg%3E");
background-repeat:no-repeat;background-size:contain;
filter:drop-shadow(0 1px 2px rgba(78,95,160,.25))}
/* ===== Cinzel - naglowki (bez faux-italic; akcent kolorem) ===== */
h1 em, h2 em, h3 em, .quote em{ font-style:normal; letter-spacing:.5px }
h1, h2, h3, .stats__num, .timeline__year, .team-card__name, .fin-offer__name,
.zaleta__title, .quote{ letter-spacing:.5px }
/* ===== Wydajnosc: nie animuj kosmosu na mobile ani gdy sekcja poza ekranem ===== */
@media (max-width:768px){
.section--dark::before, .section--dark::after, .cosmic-drift{ animation:none !important }
}
/* Drift tylko dla sekcji oznaczonej .in-view (IntersectionObserver w main.js);
dopoki brak klasy - warstwy statyczne (zero pracy GPU przy scrollu). */
.section--dark:not(.in-view)::before,
.section--dark:not(.in-view)::after{ animation-play-state:paused }
/* ===== Logo (PNG) - ograniczenia rozmiaru + poswiata na ciemnym tle ===== */
/* HEADER: granatowe logo z kosmiczna poswiata (czytelne na ciemnym pasku). */
.topbar .logo{position:relative}
.topbar .logo::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
width:116%;height:180%;max-width:340px;border-radius:50%;pointer-events:none;z-index:0;
background:radial-gradient(ellipse at center, rgba(214,220,236,.34) 0%, rgba(185,195,218,.12) 45%, rgba(185,195,218,0) 72%)}
.topbar .logo .custom-logo,
.topbar .logo img.logo__mark{
position:relative;z-index:1;
width:auto !important;height:52px !important;max-height:52px;max-width:230px;
border-radius:0 !important;box-shadow:none !important;object-fit:contain;
filter:drop-shadow(0 0 9px rgba(224,229,242,.75)) drop-shadow(0 0 20px rgba(150,165,230,.5)) !important}
.topbar.is-scrolled .logo .custom-logo,
.topbar.is-scrolled .logo img.logo__mark{height:42px !important;transform:none}
@media (max-width:768px){
.topbar .logo .custom-logo,.topbar .logo img.logo__mark{height:40px !important;max-width:170px}
}
/* FOOTER: duze i biale (z granatowego PNG robimy biel filtrem). */
.footer__logo .custom-logo,.footer__logo .footer__logo-img{
filter:brightness(0) invert(1) !important;height:84px !important;max-height:none !important;
width:auto !important;max-width:280px;border-radius:0 !important}
/* ============================================================
Galileo - poprawki UI (kosmos, gwiazdki, sticky, przyciski)
============================================================ */
/* --- Duzo wiecej kosmosu na ciemnych sekcjach (sfery pod ukosem + gwiazdy) --- */
.section--dark::after{
background-image:url("../svg/cosmos.svg") !important;
background-size:cover !important;background-position:center !important;background-repeat:no-repeat !important;
opacity:.9 !important;
}
.section--dark::before{opacity:.7}
#galeria::after,#dziennik-budowy::after,#lokalizacja::after,.team::after,.drone::after,.zalety::after{opacity:1 !important}
/* --- Kosmos takze na jasnych sekcjach (subtelnie, np. Domy) --- */
.section--cream,.section--light,.section--beige{position:relative;overflow:hidden}
.section--cream>.container,.section--light>.container,.section--beige>.container{position:relative;z-index:1}
.section--cream::after,.section--light::after,.section--beige::after{
content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
background-image:url("../svg/cosmos.svg");
background-size:cover;background-position:center;background-repeat:no-repeat;
opacity:.20;filter:saturate(.7);
}
@media (prefers-reduced-motion:reduce){.section--cream::after,.section--light::after,.section--beige::after{opacity:.14}}
/* --- Gwiazdki jako punktory listy (byly kwadraty) --- */
.feature-list{list-style:none;padding:0;margin:0}
.feature-list li{position:relative;padding-left:34px;margin-bottom:16px;font:300 16px/1.6 var(--ff-sans)}
.feature-list li::before{
content:"\2726" !important; /* czteroramienna gwiazda */
position:absolute !important;left:2px !important;top:0 !important;
width:auto !important;height:auto !important;background:none !important;background-image:none !important;
font-size:16px;line-height:1.6;color:var(--c-gold);
text-shadow:0 0 8px rgba(185,195,218,.55);
}
/* --- Smart sticky: chowa sie przy scroll w dol, wraca przy scroll w gore --- */
.topbar{transition:transform .38s cubic-bezier(.4,0,.2,1),padding .3s ease,background .3s ease,box-shadow .3s ease;will-change:transform}
.topbar.is-hidden{transform:translateY(-100%)}
/* --- Ladniejsze przyciski --- */
.btn{border-radius:40px !important;position:relative;overflow:hidden}
.btn--primary{
background:linear-gradient(135deg,var(--c-gold-soft) 0%,var(--c-gold) 55%,#9fb0d6 100%) !important;
color:var(--c-navy-deep) !important;border-color:transparent !important;font-weight:500;
box-shadow:0 8px 22px rgba(120,140,220,.28), inset 0 1px 0 rgba(255,255,255,.4);
}
.btn--primary:hover{
background:linear-gradient(135deg,#fff 0%,var(--c-gold-soft) 100%) !important;color:var(--c-navy-deep) !important;
transform:translateY(-2px);box-shadow:0 14px 34px rgba(120,140,220,.5);
}
.btn--ghost{border-color:rgba(185,195,218,.5) !important;color:var(--c-cream) !important;backdrop-filter:blur(3px)}
.btn--ghost:hover{background:rgba(185,195,218,.14) !important;color:#fff !important;border-color:var(--c-gold) !important}
@media (prefers-reduced-motion:reduce){.btn--primary:hover{transform:none}}
/* --- Zalety: bardziej elegancko --- */
.zaleta{background:linear-gradient(180deg,rgba(20,44,80,.55),rgba(11,26,48,.55)) !important;
border:1px solid rgba(185,195,218,.18) !important;border-radius:14px !important;padding:34px 30px !important;
position:relative;overflow:hidden}
.zaleta::before{content:"";position:absolute;top:0;left:26px;right:26px;height:1px;
background:linear-gradient(90deg,transparent,rgba(185,195,218,.6),transparent)}
.zaleta:hover{border-color:rgba(185,195,218,.5) !important;box-shadow:0 20px 50px rgba(0,0,0,.4)}
.zaleta__ico{width:60px !important;height:60px !important;
background:radial-gradient(circle at 30% 30%, rgba(185,195,218,.28), rgba(185,195,218,.06)) !important;
border:1px solid rgba(185,195,218,.3);color:var(--c-gold) !important;
box-shadow:0 0 24px rgba(120,140,220,.25), inset 0 0 12px rgba(185,195,218,.15);margin-bottom:20px !important}
.zaleta__ico .amenity__icon{width:26px;height:26px}
.zaleta__title{letter-spacing:1px}
/* --- Footer logo: bez owalu, duze i biale --- */
.footer__logo .custom-logo,.footer__logo .footer__logo-img{
width:auto !important;height:82px !important;max-height:none !important;max-width:280px;
border-radius:0 !important;box-shadow:none !important;object-fit:contain;
filter:brightness(0) invert(1) !important;
}
/* --- Inwestor: logo pod opisem (stack) + prosty pionowy timeline --- */
.investor__head{grid-template-columns:1fr !important;gap:26px !important;text-align:center;max-width:860px;margin:0 auto 40px !important}
.investor__head-text{order:1}
.investor__logo{order:2;max-width:260px;margin:0 auto;padding:20px 26px}
.investor__logo-img{max-height:88px}
/* Pionowa linia w dol, bloczki po prawej stronie linii */
.timeline{display:block !important;position:relative;max-width:680px;margin:0 auto !important;padding:8px 0 8px 0 !important;overflow:visible !important}
.timeline::before{left:16px !important;right:auto !important;top:0 !important;bottom:0 !important;width:2px !important;height:auto !important;
background:linear-gradient(180deg,transparent,var(--c-gold) 5%,var(--c-gold) 95%,transparent) !important}
.timeline__item{display:block !important;flex:none !important;width:100% !important;justify-content:flex-start !important;
padding-left:52px !important;margin-bottom:16px !important}
.timeline__item.is-top .timeline__card,.timeline__item.is-bottom .timeline__card{margin:0 !important}
.timeline__dot{left:16px !important;top:22px !important;margin:0 !important;transform:translate(-50%,0) !important}
.timeline__card{width:100% !important;max-width:none !important;margin:0 !important;padding:14px 20px !important;
display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.timeline__card::after{display:none !important}
.timeline__year{font:400 22px/1 var(--ff-serif) !important;color:var(--c-navy-accent);margin:0 !important;flex:none}
.timeline__desc{font:300 14px/1.5 var(--ff-sans);color:rgba(11,30,54,.7);margin:0}
/* --- Zespol: poprawne dopasowanie zdjec (Imagify owija img w ) --- */
.team-card__photo{aspect-ratio:4/5;overflow:hidden;position:relative}
.team-card__photo picture{display:block;position:absolute;inset:0;width:100%;height:100%}
.team-card__photo img,.team-card__photo .team-card__img{
width:100% !important;height:100% !important;object-fit:cover !important;object-position:center 20% !important;display:block}
/* --- Karty dziennika: poprawne dopasowanie miniatur (picture/img) --- */
.news-card__media{position:relative;display:block;aspect-ratio:16/10;overflow:hidden}
.news-card__media picture{display:block;position:absolute;inset:0;width:100%;height:100%}
.news-card__img,.news-card__media img{width:100% !important;height:100% !important;object-fit:cover !important;object-position:center !important;display:block}
/* --- Zespol: szerszy naglowek, bez opisu, wieksze karty, imie w jednej linii --- */
.team .section-header--center{max-width:900px}
.team .section-header--center .intro{display:none}
.team-grid{grid-template-columns:repeat(2,minmax(0,380px)) !important;gap:48px !important}
.team-card__name{white-space:nowrap;font:300 clamp(21px,2.2vw,27px)/1.15 var(--ff-serif) !important;letter-spacing:.3px}
@media (max-width:820px){ .team-card__name{white-space:normal} }
/* --- Cytat przed kontaktem: logo po lewo (prostokat, bez kolek), cytat po prawo, nizsza sekcja --- */
.quote-section--cosmic{padding:clamp(44px,6vw,76px) 0 !important}
.quote-wrap{max-width:1040px !important;flex-direction:row !important;align-items:center !important;
gap:clamp(32px,5vw,64px) !important;text-align:left !important}
.quote-logo{flex:0 0 auto;max-width:320px;flex-direction:column;align-items:flex-start;gap:8px}
.quote-logo img,.quote-logo .quote-logo__main{border-radius:0 !important;width:auto !important;max-width:300px !important;height:auto !important}
.quote-logo__wordmark{text-align:left}
.quote-section--cosmic .quote{text-align:left !important;flex:1;margin:0}
.quote-sub{text-align:left}
@media (max-width:760px){
.quote-wrap{flex-direction:column !important;text-align:center !important;align-items:center !important;gap:24px !important}
.quote-logo{align-items:center;max-width:240px}
.quote-logo__main{max-width:220px !important}
.quote-section--cosmic .quote,.quote-sub{text-align:center !important}
}
/* --- Footer: 2 agentki + biuro sprzedazy --- */
.footer__col--agents .footer__agent{margin-bottom:18px;display:flex;flex-direction:column;gap:2px}
.footer__agent-name{font:400 16px/1.3 var(--ff-serif);color:var(--c-cream)}
.footer__agent-role{font:400 11px/1.4 var(--ff-sans);letter-spacing:.5px;color:var(--c-gold);margin-bottom:4px}
.footer__agent a{font-size:13px;opacity:.85}
.footer__agent a:hover{opacity:1;color:var(--c-gold)}
.footer__office{display:block}
.footer__office strong{display:block;color:var(--c-gold);font-weight:500;letter-spacing:.5px;margin-bottom:6px;font-size:13px}
.footer__office span{display:block;opacity:.82;line-height:1.6}
/* --- Kontrast: na jasnych sekcjach akcenty granatowe (#4E5FA0), nie srebrne --- */
.section--cream .eyebrow,.section--light .eyebrow,.section--beige .eyebrow{color:var(--c-navy-accent)}
.section--cream h2 em,.section--light h2 em,.section--beige h2 em,
.section--cream h1 em,.section--light h1 em,.section--beige h1 em{color:var(--c-navy-accent)}
.promo-card__tag{color:var(--c-navy-accent) !important;background:rgba(78,95,160,.08) !important}
.type-card .eyebrow,.types .eyebrow{color:var(--c-navy-accent)}
/* linki/akcenty tekstowe na jasnym tle - ciemniejszy srebrno-granat dla czytelnosci */
.section--cream a.link-download,.section--light a.link-download,.section--beige a.link-download{color:var(--c-gold-deep)}
/* --- O inwestycji: zdjecie + punkty po lewej, tytul/opis + punkty po prawej --- */
.about-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:clamp(30px,5vw,64px);align-items:start}
.about-grid__media{display:flex;flex-direction:column;gap:22px}
.about-grid__image{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;box-shadow:var(--shadow-card-hover);display:block}
.about-grid__text{display:flex;flex-direction:column}
.about-grid__text h2{margin-bottom:18px}
.about-grid__feats{margin-top:22px}
.about-grid__media .about-grid__feats{margin-top:4px}
.about-cta{text-align:center;margin-top:clamp(34px,5vw,54px)}
@media (max-width:860px){
.about-grid{grid-template-columns:1fr;gap:26px}
.about-grid__media{order:0}
.about-grid__media .about-grid__feats{display:none} /* na mobile nie dublujemy punktow */
}
/* --- Bogatsze, ZROZNICOWANE tla ciemnych sekcji (jak pas "pod gwiazdami") --- */
.section--dark{background:radial-gradient(130% 150% at 50% -8%, var(--c-navy-mid) 0%, var(--c-navy) 42%, var(--c-navy-deep) 100%)}
#z-lotu{background:radial-gradient(120% 150% at 14% 0%, var(--c-navy-mid) 0%, var(--c-navy-deep) 82%)}
#dziennik-budowy{background:radial-gradient(120% 150% at 86% 6%, var(--c-navy) 0%, var(--c-navy-deep) 86%)}
#lokalizacja{background:radial-gradient(150% 160% at 50% 112%, var(--c-navy-mid) 0%, var(--c-navy-deep) 68%)}
#zalety{background:radial-gradient(120% 150% at 18% 100%, var(--c-navy) 0%, var(--c-navy-deep) 82%)}
#doradcy{background:radial-gradient(120% 150% at 82% 90%, var(--c-navy-mid) 0%, var(--c-navy-deep) 82%)}
#standard{background:radial-gradient(120% 150% at 30% 6%, var(--c-navy-mid) 0%, var(--c-navy-deep) 86%)}
#kontakt{background:radial-gradient(130% 150% at 50% 0%, var(--c-navy-mid) 0%, var(--c-navy-deep) 92%)}
/* wyrazniejsze gwiazdy na ciemnych sekcjach */
.section--dark::before{opacity:.85}
/* ============================================================
Ujednolicenie: eyebrow + tytuly + akcent niebiesko-srebrny
(zamiast ciemnego granatu). Logo w navbarze srebrno-kosmiczne.
============================================================ */
:root{
--c-accent:#B9C3DA; /* jasny niebiesko-srebrny (na ciemnym tle) */
--c-navy-accent:#4E5FA0; /* czytelny niebiesko-srebrny (na jasnym tle) */
--c-gold-deep:#4E5FA0; /* nadpisuje dawny #000073 wszedzie, gdzie byl uzyty */
}
/* Jednolity EYEBROW (podtytul) w kazdej sekcji */
.eyebrow{
font:400 12px/1.4 var(--ff-sans) !important;
letter-spacing:3.5px !important;
text-transform:uppercase !important;
margin-bottom:20px !important;
}
.section--dark .eyebrow,.stars-band .eyebrow,.quote-section .eyebrow,.drone .eyebrow,.news .eyebrow,.team .eyebrow{color:var(--c-accent) !important}
.section--light .eyebrow,.section--cream .eyebrow,.section--beige .eyebrow{color:var(--c-navy-accent) !important}
/* Jednolity TYTUL sekcji (Cinzel) + akcent */
.section h2,.section-header h2,.stars-band__title,.about-grid__text h2,.investor__head h2{
font:400 clamp(30px,4vw,50px)/1.14 var(--ff-serif) !important;letter-spacing:.5px !important;
}
h1 em,h2 em,h3 em{font-style:normal !important} /* Cinzel bez faux-italic */
.section--dark h2 em,.section--dark h1 em,.section--dark h3 em,.stars-band h2 em,.quote em,.hero h1 em,.contact-cta__title em,.team h2 em,.drone h2 em,.news h2 em{color:var(--c-accent) !important}
.section--light h2 em,.section--cream h2 em,.section--beige h2 em,.section--light h1 em,.about-grid__text h2 em,.investor__head h2 em,.type-card h3 em{color:var(--c-navy-accent) !important}
.promo-card__tag{color:var(--c-navy-accent) !important;background:rgba(78,95,160,.10) !important}
/* Logo w navbarze - srebrno-kosmiczny odcien (z granatowego PNG) + poswiata */
.topbar .logo .custom-logo,.topbar .logo img.logo__mark{
filter:brightness(0) invert(74%) sepia(22%) saturate(900%) hue-rotate(188deg) brightness(1.02)
drop-shadow(0 0 9px rgba(185,195,218,.6)) drop-shadow(0 0 20px rgba(120,140,220,.4)) !important;
}
/* --- Fix: przycisk telefonu w karcie Anny (ikona + numer wysrodkowane, wiekszy numer) --- */
.fin-offer__cta .btn{display:inline-flex !important;align-items:center;justify-content:center;gap:12px;width:100%}
.fin-offer__cta .btn svg{width:18px;height:18px;flex:none}
.fin-offer__cta .btn--primary{font-size:15px;letter-spacing:2px;padding:16px 24px}
/* --- Inwestor: tekst+logo po lewej, timeline PIONOWY po prawej --- */
.investor .container{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,60px);align-items:start}
.investor__head{grid-template-columns:1fr !important;text-align:left !important;margin:0 !important;max-width:none !important;gap:24px !important}
.investor__head-text{order:1}
.investor__logo{order:2;margin:0 !important;max-width:240px}
.investor .timeline{margin:0 !important;max-width:none !important;padding-top:0 !important}
@media (max-width:900px){ .investor .container{grid-template-columns:1fr;gap:36px} .investor__logo{margin:0 auto !important} }
/* --- Cytat: uklad po kolei (logo -> kreska -> cytat -> podpis), bez kolek --- */
.quote-stack{max-width:760px;margin:0 auto;display:flex !important;flex-direction:column;align-items:center;text-align:center;gap:26px}
.quote-stack__logo{width:auto;max-width:300px;height:auto;display:block;border-radius:0;
filter:brightness(0) invert(1) drop-shadow(0 2px 14px rgba(0,0,0,.55))}
.quote-stack__wordmark{font:300 44px/1 var(--ff-serif);color:var(--c-cream)}
.quote-stack__divider{width:64px;height:1px;background:linear-gradient(90deg,transparent,var(--c-accent),transparent)}
.quote-section--cosmic .quote{text-align:center !important;margin:0;flex:none}
.quote-section--cosmic .quote-sub{text-align:center !important}
@media (max-width:600px){ .quote-stack__logo{max-width:220px} }
/* --- Fix: ikona w kafelku Zalety idealnie wysrodkowana --- */
.zaleta__ico{display:flex !important;align-items:center !important;justify-content:center !important;line-height:0}
.zaleta__ico .amenity__icon,.zaleta__ico svg{width:26px !important;height:26px !important;display:block;margin:0}
/* ============================================================
FIX wydajnosci + navbar (koniec zacinania scrolla i oscylacji logo)
============================================================ */
/* 1) Wylacz drift kosmosu - to on obciazal scroll. Tla zostaja bogate, ale statyczne. */
.section--dark::before,.section--dark::after,.section--cream::after,.section--light::after,.section--beige::after,.cosmic-drift{animation:none !important}
/* 2) Sticky navbar bez zmian layoutu (tylko chowanie transformem) - koniec petli reflow */
.topbar{padding:10px 0 !important;will-change:auto}
.topbar.is-scrolled{padding:10px 0 !important;background:rgba(8,20,40,.97);box-shadow:0 6px 24px rgba(0,0,0,.28)}
.topbar.is-scrolled .logo svg,.topbar.is-scrolled .logo img.logo__mark,
.topbar.is-scrolled .custom-logo,.topbar.is-scrolled .logo .custom-logo{transform:none !important}
/* 3) Logo: srebrne + STABILNE wymiary (koniec oscylacji auto<->400) */
.topbar .custom-logo,.topbar .custom-logo-link .custom-logo,.topbar .logo .custom-logo,.topbar .logo img.logo__mark{
height:46px !important;width:auto !important;max-width:210px !important;min-height:0 !important;max-height:46px !important;
border-radius:0 !important;box-shadow:none !important;object-fit:contain;
filter:brightness(0) invert(.82) drop-shadow(0 0 8px rgba(185,195,218,.6)) !important;
}
.topbar .custom-logo-link{display:inline-flex;align-items:center;line-height:0}
.topbar .logo::before{display:none} /* zbedna owalna poswiata, moze migotac */
/* --- Typy domow: 2 karty (duze) / 1 (telefon), wieksze, obraz wypelnia kadr --- */
.types-slide{flex:0 0 calc((100% - 1.75rem) / 2) !important}
@media (max-width:768px){ .types-slide{flex:0 0 100% !important} }
.type-card__plan{aspect-ratio:3/2 !important;background:#efe9dc !important}
.type-card__plan picture{position:absolute;inset:0;width:100%;height:100%;display:block}
.type-card__plan-img,.type-card__plan img{width:100% !important;height:100% !important;object-fit:cover !important;display:block}
.type-card__body{padding:2rem 2.1rem 2.2rem !important}
.type-card h3{font-size:2.4rem !important}
.type-card{transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.type-card:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(11,30,54,.2)}
/* --- Ostre rogi (proste kreski) - wyjatek: przyciski i karty Zalety --- */
.about-grid__image,.two-col__image,
.type-card,.type-card__plan,.type-card__plan-img,
.apt-card,
.team-card__photo,.team-card__img,
.news-card,.news-card__media,.news-card__img,.news-drawer__thumb,
.drone-frame,.drone-stage__side,
.investor__logo,.investor__logo-img,.timeline__card,
.fin-offer,.promo-card,
.band-slider,.location-map__canvas{border-radius:0 !important}
/* zaokraglenia tylko tu: przyciski + karty Zalety */
.btn,.type-card__link,.fin-offer__cta .btn{border-radius:40px !important}
.zaleta{border-radius:16px !important}
/* --- Zespol: dlugie imie (Aleksandra Dzierzanowska) ma sie miescic i byc wysrodkowane --- */
.team-card__name{white-space:normal !important;overflow-wrap:break-word;text-align:center;
font-size:clamp(19px,1.9vw,24px) !important;line-height:1.2 !important}
.team-card__info{text-align:center;align-items:center}
/* --- Cytat: logo po LEWEJ, cytat po prawej (nizsza sekcja na laptopach) --- */
.quote-section--cosmic{padding:clamp(38px,5vw,64px) 0 !important}
.quote-stack{max-width:1060px !important;flex-direction:row !important;align-items:center !important;
text-align:left !important;gap:clamp(28px,4vw,56px) !important}
.quote-stack__logo{flex:0 0 auto;max-width:clamp(190px,22vw,280px) !important}
.quote-stack__divider{width:1px !important;height:clamp(88px,11vw,128px) !important;
background:linear-gradient(180deg,transparent,var(--c-accent),transparent) !important;flex:0 0 auto}
.quote-section--cosmic .quote{text-align:left !important;flex:1;margin:0;font-size:clamp(23px,2.9vw,37px) !important}
.quote-section--cosmic .quote-sub{text-align:left !important}
@media (max-width:760px){
.quote-stack{flex-direction:column !important;text-align:center !important;gap:22px !important}
.quote-stack__logo{max-width:200px !important}
.quote-stack__divider{width:64px !important;height:1px !important}
.quote-section--cosmic .quote,.quote-section--cosmic .quote-sub{text-align:center !important}
}
/* ============================================================
FIX: .types i .investor to teraz SEKCJE (nie siatki kart).
Stary grid z Soresort robil sekcje na pol strony. Zerujemy go.
============================================================ */
.section.types{display:block !important;grid-template-columns:none !important;gap:0 !important}
.section.investor{display:block !important;grid-template-columns:none !important;gap:0 !important}
/* type-card__plan: bez ramki/tla - widoczne tylko zdjecie */
.type-card__plan{background:transparent !important;border:0 !important}
/* --- Przycisk w kartach typow: wysrodkowany i pelnej szerokosci --- */
.type-card__actions{margin-top:auto;display:flex;justify-content:center;width:100%}
.type-card__link{display:block !important;width:100% !important;text-align:center;padding:.95rem 1.4rem !important}
/* ============================================================
Navbar: prosty, niezawodny STICKY (bez JS hide/show - koniec bugowania)
============================================================ */
html{overflow-x:visible !important} /* clip potrafil psuc position:sticky */
.topbar{
position:sticky !important;top:0 !important;z-index:300 !important;
transform:none !important;transition:background .25s ease !important;
box-shadow:0 4px 20px rgba(0,0,0,.2);
}
.topbar.is-hidden{transform:none !important} /* nawet gdyby klasa gdzies zostala - nie chowaj */
.topbar.is-scrolled{transform:none !important;padding:10px 0 !important}
/* --- Inwestor: logo na cala szerokosc kolumny z tekstem, wieksze --- */
.investor__logo{max-width:none !important;width:100% !important;padding:26px 32px !important}
.investor__logo-img{width:100% !important;max-width:100% !important;height:auto !important;max-height:none !important;object-fit:contain}
/* --- Mobile: informacje w karcie domu 1 w rzedzie (pojedyncza kolumna) --- */
@media (max-width:600px){
.apt-card__meta{grid-template-columns:1fr !important}
.type-specs{grid-template-columns:1fr !important}
}
/* --- Usun lekkie tlo (kosmos/tekstura) za sliderem typow --- */
.section.types::after{content:none !important;display:none !important;background:none !important}
/* --- Dziennik budowy: slider na telefonie (przesuwanie, 1 karta na widok) --- */
@media (max-width:768px){
.news-grid{
display:flex !important;grid-template-columns:none !important;
overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;
-webkit-overflow-scrolling:touch;scrollbar-width:none;
padding:2px 2px 10px;margin:0 -2px;
}
.news-grid::-webkit-scrollbar{display:none}
.news-card{flex:0 0 84%;scroll-snap-align:center;min-width:0}
}
/* --- Zespol na mobile: 1 karta w wierszu + overlay po kliknieciu w zdjecie --- */
@media (max-width:768px){
.team-grid{grid-template-columns:minmax(0,380px) !important;justify-content:center}
}
@media (max-width:640px){
.team-card__overlay{position:absolute !important;inset:0;opacity:0;transform:translateY(12px);
background:linear-gradient(0deg,rgba(8,20,40,.94) 0%,rgba(8,20,40,.7) 45%,rgba(8,20,40,0) 100%);border-radius:0}
.team-card.is-revealed .team-card__overlay,.team-card:focus-within .team-card__overlay{opacity:1 !important;transform:none !important}
.team-card__photo{cursor:pointer}
}
/* --- Preloader: logo (custom) srebrne, poziome, NIE przyciete (bez kwadratu) --- */
.preloader__logo-img{
height:60px !important;width:auto !important;max-width:min(72vw,260px);display:block;
filter:brightness(0) invert(.82) drop-shadow(0 0 10px rgba(185,195,218,.5));
animation:preloaderScale 1.2s ease-in-out infinite;
}
@media (prefers-reduced-motion:reduce){.preloader__logo-img{animation:none}}
/* --- Subtelne jasne tlo pod sliderem typow (na tracku) --- */
.types-slider__track{background:linear-gradient(180deg,#fbf8f2 0%,#f1ebdf 100%)}
/* ============================================================
GLOBAL FIX: Imagify/LiteSpeed owija ![]()
w - przez to obrazek
nie dopasowuje sie do kontenera. display:contents "usuwa" wrapper z layoutu,
wiec ![]()
(z object-fit/aspect-ratio) dziala jak bezposrednie dziecko.
============================================================ */
picture{display:contents !important}
picture > img{display:block}
/* Cloudflare Turnstile widget - odstep w formularzach */
.cf-turnstile{margin:4px 0 14px}