/* ═══════════════════════════════════════════
DOBRY DOM REAL ESTATE — PREMIUM THEME
Style: Modern, Airy, Rounded
Color: Gold #ffd800 | Navy #1a2332 | White
Fonts: Inter (body), Playfair Display (headings)
═══════════════════════════════════════════ */
/* ── CSS Variables ── */
:root {
--color-primary: #ffd800;
--color-primary-dark: #e6c200;
--color-primary-light: #fff8d6;
--color-dark: #1a2332;
--color-dark-soft: #243347;
--color-text: #2d3748;
--color-text-light: #5a6a7e;
--color-text-muted: #94a3b8;
--color-border: #e8ecf1;
--color-border-dark: #3a4a5c;
--color-bg: #fff;
--color-bg-light: #f8fafb;
--color-bg-dark: #1a2332;
--color-bg-warm: #fffdf5;
--color-success: #22c55e;
--color-danger: #ef4444;
--font-body: 'Inter', system-ui, -apple-system, sans-serif;
--font-heading: 'Playfair Display', Georgia, serif;
--shadow: 0 1px 3px rgba(0,0,0,.04), 0 2px 8px rgba(0,0,0,.03);
--shadow-md: 0 2px 8px rgba(0,0,0,.05);
--shadow-lg: 0 4px 16px rgba(0,0,0,.06);
--shadow-hover: 0 8px 24px rgba(0,0,0,.1);
--shadow-float: 0 4px 20px rgba(0,0,0,.06);
--transition: .25s ease;
--radius: 12px;
--radius-sm: 8px;
--radius-lg: 16px;
--radius-xl: 20px;
--radius-pill: 50px;
--container-max: 1280px;
--section-padding: 6.5rem 0;
--grid-gap: 2rem;
--card-padding: 1.75rem;
--line: 1px solid var(--color-border);
--line-gold: 2px solid var(--color-primary);
--line-dark: 1px solid var(--color-border-dark);
}
/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: clip; }
body { font-family: var(--font-body); color: var(--color-text); background: var(--color-bg); line-height: 1.7; font-size: 16px; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-dark); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-primary-dark); }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); line-height: 1.2; color: var(--color-dark); font-weight: 600; }
h1 { font-size: clamp(2.25rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); }
h3 { font-size: clamp(1.1rem, 2vw, 1.4rem); }
ul, ol { list-style: none; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: inherit; font-size: 1rem; }
/* ── Layout ── */
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 2rem; }
.section { padding: var(--section-padding); position: relative; }
.section--light { background: var(--color-bg-light); }
.section--dark { background: var(--color-bg-dark); color: #fff; }
.section--cta { background: transparent; color: #fff; padding: 6rem 0; }
/* Smooth overlapping section transitions */
.section--light {
border-radius: 2.5rem 2.5rem 0 0;
margin-top: -1.5rem;
position: relative;
z-index: 1;
}
.section--dark {
border-radius: 2.5rem 2.5rem 0 0;
margin-top: -1.5rem;
position: relative;
z-index: 1;
}
.section--light + .section:not(.section--light):not(.section--dark):not(.section--cta) {
border-radius: 2.5rem 2.5rem 0 0;
margin-top: -1.5rem;
position: relative;
z-index: 2;
}
@media (max-width: 768px) {
.section--light,
.section--dark,
.section--light + .section:not(.section--light):not(.section--dark):not(.section--cta) {
border-radius: 1.25rem 1.25rem 0 0;
margin-top: -0.75rem;
}
}
@media (max-width: 480px) {
.section--light,
.section--dark,
.section--light + .section:not(.section--light):not(.section--dark):not(.section--cta) {
border-radius: .75rem .75rem 0 0;
margin-top: -0.5rem;
}
}
/* ── Parallax Image Divider — fixed background "window" ── */
.section-divider {
position: relative;
height: 480px;
background-size: cover;
background-position: center;
background-attachment: fixed;
background-repeat: no-repeat;
overflow: hidden;
}
.section-divider::after {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(to bottom, rgba(26,35,50,.15) 0%, rgba(26,35,50,.05) 50%, rgba(26,35,50,.15) 100%);
}
.section-divider + .section { margin-top: 0; border-radius: 0; }
.section-divider + .section--light { margin-top: 0; border-radius: 0; }
.section-divider + .section--dark { margin-top: 0; border-radius: 0; }
@media (max-width: 768px) {
.section-divider { height: 380px; background-attachment: scroll; }
}
@media (max-width: 480px) {
.section-divider { height: 260px; }
}
/* (page-hero--media styles consolidated below in PAGE TEMPLATES section) */
.site-main { padding-top: 90px; }
body.admin-bar .site-main { padding-top: 122px; }
@media (max-width: 782px) { body.admin-bar .site-main { padding-top: 136px; } }
@media (max-width: 768px) { .site-main { padding-top: 70px; } body.admin-bar .site-main { padding-top: 116px; } }
@media (max-width: 480px) { .site-main { padding-top: 60px; } }
.text-center { text-align: center; }
.text-gold { color: var(--color-primary); }
/* ── Buttons — Pill Shape ── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 2rem; font-weight: 600; font-size: .875rem; border: 2px solid transparent; border-radius: var(--radius-pill); transition: all var(--transition); text-decoration: none; cursor: pointer; line-height: 1.4; letter-spacing: .02em; text-transform: uppercase; }
.btn-sm { padding: .55rem 1.25rem; font-size: .8rem; }
.btn-lg { padding: 1rem 2.5rem; font-size: .95rem; }
.btn-block { display: flex; width: 100%; }
.btn-primary { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
.btn-primary:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: var(--color-dark); }
.btn-dark { background: var(--color-dark); color: #fff; border-color: var(--color-dark); }
.btn-dark:hover { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-dark); }
.btn-outline { background: transparent; color: var(--color-dark); border-color: var(--color-dark); }
.btn-outline:hover { background: var(--color-dark); color: #fff; }
.btn-outline-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); }
.btn-outline-light:hover { background: #fff; border-color: #fff; color: var(--color-dark); }
.btn-outline-gold { background: transparent; color: var(--color-primary); border-color: var(--color-primary); }
.btn-outline-gold:hover { background: var(--color-primary); color: var(--color-dark); }
/* ── Header — Floating White Navbar ── */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: transparent; padding: .5rem 2rem; transition: padding .3s ease, background .3s ease; }
.site-header > .header-top,
.site-header > .header-main,
.site-header > .mobile-menu { max-width: var(--container-max); margin-left: auto; margin-right: auto; }
.header-top { background: var(--color-dark); border-radius: var(--radius-xl) var(--radius-xl) 0 0; font-size: .8rem; max-height: 40px; overflow: hidden; transition: max-height .3s ease, opacity .3s ease, border-radius .3s ease; position: relative; z-index: 2; }
.header-top .container { display: flex; justify-content: space-between; align-items: center; padding-top: .35rem; padding-bottom: .35rem; }
.header-top-left { display: flex; gap: 1.5rem; }
.header-contact-link { display: flex; align-items: center; gap: .4rem; color: rgba(255,255,255,.65); transition: color var(--transition); font-size: .8rem; }
.header-contact-link:hover { color: var(--color-primary); }
.header-top-right { display: flex; gap: .75rem; }
.social-link { color: rgba(255,255,255,.5); display: flex; transition: color var(--transition); }
.social-link:hover { color: var(--color-primary); }
.header-main { background: #fff; border-radius: 0 0 var(--radius-xl) var(--radius-xl); box-shadow: var(--shadow-float); transition: border-radius .3s ease, box-shadow .3s ease; position: relative; z-index: 2; }
.site-header:not(:has(.header-top)) .header-main { border-radius: var(--radius-xl); }
.header-main .container { display: flex; align-items: center; justify-content: space-between; padding-top: .65rem; padding-bottom: .65rem; gap: 2rem; }
.site-logo img { max-height: 45px; width: auto; }
.site-title-link { text-decoration: none; }
.site-title { font-family: var(--font-heading); font-size: 1.4rem; color: var(--color-dark); font-weight: 700; }
/* ── Navigation — Rounded ── */
.main-menu { display: flex; gap: .25rem; align-items: center; }
.main-menu li { position: relative; }
.main-menu > li > a { color: var(--color-text); padding: .5rem .85rem; display: block; font-size: .85rem; font-weight: 500; transition: all var(--transition); letter-spacing: .01em; border-radius: var(--radius-sm); }
.main-menu > li > a:hover { color: var(--color-dark); background: var(--color-bg-light); }
.main-menu > li.current-menu-item > a { color: var(--color-primary-dark); background: var(--color-primary-light); font-weight: 600; }
/* Submenu — Rounded */
.main-menu .sub-menu { position: absolute; top: calc(100% + .35rem); left: 0; background: #fff; box-shadow: var(--shadow-lg); min-width: 240px; padding: .5rem; opacity: 0; visibility: hidden; transform: translateY(4px); transition: all var(--transition); z-index: 100; border-radius: var(--radius); }
.main-menu li:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.main-menu .sub-menu a { color: var(--color-text); padding: .55rem 1rem; display: block; font-size: .85rem; border-radius: var(--radius-sm); }
.main-menu .sub-menu a:hover { background: var(--color-primary-light); color: var(--color-dark); }
.header-actions { display: flex; align-items: center; gap: .75rem; }
/* ── Mobile Menu Toggle — Hamburger → X ── */
.mobile-menu-toggle { display: none; background: none; border: none; padding: .65rem; cursor: pointer; position: relative; z-index: 10; border-radius: var(--radius-sm); transition: background .25s ease; }
.mobile-menu-toggle:hover { background: var(--color-bg-light); }
.mobile-menu-toggle[aria-expanded="true"] { background: var(--color-bg-light); }
.hamburger { display: flex; flex-direction: column; gap: 6px; width: 24px; }
.hamburger span { display: block; width: 100%; height: 2px; background: var(--color-dark); border-radius: 2px; transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .2s ease, background .25s ease; transform-origin: center; }
/* Hamburger → X animation */
.mobile-menu-toggle[aria-expanded="true"] .hamburger span { background: var(--color-primary-dark); }
.mobile-menu-toggle[aria-expanded="true"] .hamburger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.mobile-menu-toggle[aria-expanded="true"] .hamburger span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.mobile-menu-toggle[aria-expanded="true"] .hamburger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
/* ── Mobile Menu — Slides down from navbar, same width ── */
.mobile-menu { max-width: var(--container-max); margin: 0 auto; }
.mobile-menu-panel { background: #fff; border-radius: 0 0 var(--radius-xl) var(--radius-xl); box-shadow: 0 16px 48px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.04); padding: 0 1.5rem; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .45s cubic-bezier(.4,0,.2,1), opacity .3s ease, padding .35s ease; }
.mobile-menu.active .mobile-menu-panel { max-height: 80vh; opacity: 1; padding: .75rem 1.5rem 1.5rem; overflow-y: auto; }
/* When menu is open, connect header-main bottom to panel top */
.site-header.menu-open .header-main { border-radius: var(--radius-xl) var(--radius-xl) 0 0 !important; box-shadow: none; transition: border-radius .2s ease, box-shadow .2s ease; }
/* Backdrop removed — menu shows page content behind */
/* ── Mobile Menu List ── */
.mobile-menu-list { list-style: none; padding: 0; margin: 0; }
.mobile-menu-list li { opacity: 0; transform: translateX(-12px); transition: opacity .3s ease, transform .3s ease; }
.mobile-menu.active .mobile-menu-list li { opacity: 1; transform: translateX(0); }
.mobile-menu.active .mobile-menu-list li:nth-child(1) { transition-delay: .08s; }
.mobile-menu.active .mobile-menu-list li:nth-child(2) { transition-delay: .13s; }
.mobile-menu.active .mobile-menu-list li:nth-child(3) { transition-delay: .18s; }
.mobile-menu.active .mobile-menu-list li:nth-child(4) { transition-delay: .23s; }
.mobile-menu.active .mobile-menu-list li:nth-child(5) { transition-delay: .28s; }
.mobile-menu.active .mobile-menu-list li:nth-child(6) { transition-delay: .33s; }
.mobile-menu.active .mobile-menu-list li:nth-child(7) { transition-delay: .38s; }
.mobile-menu.active .mobile-menu-list li:nth-child(8) { transition-delay: .43s; }
.mobile-menu-list li a { display: flex; align-items: center; gap: .5rem; color: var(--color-dark); padding: .85rem 1rem; font-size: 1.05rem; font-weight: 500; text-align: left; letter-spacing: .01em; transition: all var(--transition); text-decoration: none; border-radius: var(--radius-sm); }
.mobile-menu-list li a:hover,
.mobile-menu-list li a:active { color: var(--color-primary-dark); background: var(--color-bg-light); }
.mobile-menu-list li.current-menu-item > a { color: var(--color-primary-dark); background: var(--color-primary-light); font-weight: 600; }
/* Submenu */
.mobile-menu-list .sub-menu { list-style: none; padding: 0 0 0 1.25rem; margin: 0; border-left: 2px solid var(--color-border); margin-left: 1rem; }
.mobile-menu-list .sub-menu li a { font-size: .92rem; font-weight: 400; padding: .6rem .85rem; color: var(--color-text-light); }
/* ── Mobile Menu Footer — CTA + Contact ── */
.mobile-menu-footer { margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--color-border); opacity: 0; transform: translateY(10px); transition: opacity .3s ease .3s, transform .3s ease .3s; }
.mobile-menu.active .mobile-menu-footer { opacity: 1; transform: translateY(0); }
.mobile-menu-cta { text-align: center; font-size: .9rem; }
.mobile-menu-cta svg { flex-shrink: 0; }
.mobile-menu-contact { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; justify-content: center; }
.mobile-menu-contact-item { display: flex; align-items: center; gap: .4rem; color: var(--color-text-light); font-size: .82rem; padding: .25rem 0; text-decoration: none; transition: color var(--transition); }
a.mobile-menu-contact-item:hover { color: var(--color-primary-dark); }
@media (max-width: 1200px) {
.main-navigation { display: none; }
.mobile-menu-toggle { display: block; }
.header-actions > a.btn { display: none; }
}
@media (max-width: 768px) {
.site-header { padding: .35rem .75rem; }
.site-header.scrolled { padding: .2rem .75rem; }
.header-top { display: none; }
.header-main { border-radius: var(--radius-lg) !important; }
.header-main .container { padding-top: .5rem; padding-bottom: .5rem; gap: 1rem; }
.mobile-menu.active .mobile-menu-panel { padding: .5rem 1.25rem 1.25rem; }
.mobile-menu-list li a { padding: .75rem .85rem; font-size: 1rem; }
.header-contact-link { font-size: .72rem; }
}
@media (max-width: 480px) {
.site-header { padding: .2rem .5rem; }
.site-header.scrolled { padding: .15rem .5rem; }
.header-main .container { padding-top: .4rem; padding-bottom: .4rem; gap: .75rem; }
.mobile-menu.active .mobile-menu-panel { padding: .5rem 1rem 1rem; border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.mobile-menu-list li a { padding: .7rem .75rem; font-size: .95rem; }
}
/* ═══════════════════════════════════════════
HERO SECTION — Premium Statement
═══════════════════════════════════════════ */
.hero-section { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--color-dark); background-size: cover; background-position: center; color: #fff; overflow: hidden; padding: 8rem 0 4rem; margin-top: -90px; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(26,35,50,.5) 0%, rgba(26,35,50,.4) 50%, rgba(26,35,50,.55) 100%); z-index: 1; }
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-content { position: relative; z-index: 5; text-align: center; width: 100%; }
.hero-sengine-wrap { max-width: 1100px; margin: 1.5rem auto 0; text-align: left; }
.hero-sengine-wrap .asariplug_sengine { background: rgba(255,255,255,.95); backdrop-filter: blur(8px); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }
/* ── Hero Slider ── */
.hero-slides { position: absolute; inset: 0; z-index: 0; }
.hero-slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1s ease; }
.hero-slide.is-active { opacity: 1; }
.hero-slider-dots { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); display: flex; gap: .5rem; z-index: 3; }
.hero-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.35); border: none; cursor: pointer; padding: 0; transition: background .3s ease, transform .3s ease; }
.hero-dot.is-active { background: var(--color-primary); transform: scale(1.4); }
/* ── Location Autocomplete ── */
.location-autocomplete-list { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid var(--color-border); border-top: none; border-radius: 0 0 var(--radius-md) var(--radius-md); list-style: none; margin: 0; padding: 0; z-index: 100; box-shadow: var(--shadow-md); max-height: 300px; overflow-y: auto; }
.location-autocomplete-item { padding: .6rem 1rem; font-size: .95rem; color: var(--color-dark); cursor: pointer; transition: background .15s ease; line-height: 1.3; }
.location-autocomplete-item:hover, .location-autocomplete-item.is-active { background: var(--color-bg-light); color: var(--color-primary-dark); }
.loc-ac-region { display: block; font-size: .72rem; opacity: .55; font-weight: 500; letter-spacing: .02em; line-height: 1.2; }
.location-autocomplete-loading { padding: .75rem 1rem; font-size: .85rem; color: var(--color-text-muted); font-style: italic; cursor: default; }
.hero-label { display: inline-flex; align-items: center; gap: .5rem; font-size: .72rem; font-weight: 600; letter-spacing: .25em; text-transform: uppercase; color: var(--color-primary); margin-bottom: 1.75rem; background: rgba(255,216,0,.1); backdrop-filter: blur(8px); padding: .5rem 1.5rem; border-radius: var(--radius-pill); border: 1px solid rgba(255,216,0,.2); }
.hero-title { font-size: clamp(2.5rem, 5.5vw, 3.75rem); margin-bottom: 1.5rem; font-weight: 700; letter-spacing: -.02em; color: #fff; line-height: 1.15; }
.hero-subtitle { font-size: 1.1rem; color: rgba(255,255,255,.85); margin-bottom: 3rem; max-width: 620px; margin-left: auto; margin-right: auto; line-height: 1.8; font-weight: 300; letter-spacing: .01em; }
/* ═══════════════════════════════════════════
STATS BAR — Gold Accent
═══════════════════════════════════════════ */
.stats-bar { background: transparent; padding: 0; position: relative; z-index: 3; margin-top: -2rem; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--color-primary); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); max-width: var(--container-max); margin: 0 auto; overflow: hidden; }
.stat-item { padding: 2rem 1.5rem; text-align: center; position: relative; }
.stat-item:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 20%; height: 60%; width: 1px; background: rgba(30,30,30,.15); }
.stat-number { font-family: var(--font-heading); font-size: 2.5rem; font-weight: 700; color: var(--color-dark); line-height: 1; margin-bottom: .25rem; }
.stat-label { font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: rgba(30,30,30,.7); }
@media (max-width: 768px) {
.stats-bar { margin-top: -1rem; }
.stats-grid { grid-template-columns: repeat(2, 1fr); border-radius: var(--radius-lg); }
.stat-item:nth-child(2)::after { display: none; }
.stat-item:nth-child(1), .stat-item:nth-child(2) { border-bottom: 1px solid rgba(30,30,30,.1); }
.stat-item { padding: 1.5rem 1rem; }
.stat-number { font-size: 2rem; }
}
@media (max-width: 480px) {
.stats-grid { grid-template-columns: 1fr 1fr; border-radius: var(--radius); }
.stat-item { padding: 1rem .75rem; }
.stat-number { font-size: 1.6rem; }
.stat-label { font-size: .65rem; letter-spacing: .06em; }
}
/* Stats with Parallax (About page) */
.stats-parallax {
position: relative;
background-size: cover;
background-position: center;
background-attachment: fixed;
background-repeat: no-repeat;
padding: 6rem 0 22rem;
z-index: 2;
}
.stats-parallax::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 30%;
background: var(--color-bg-light);
z-index: 0;
}
.stats-parallax::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 70%;
background: linear-gradient(to bottom, rgba(26,35,50,.02), rgba(26,35,50,.2));
z-index: 0;
}
.stats-parallax .container {
position: relative;
z-index: 1;
}
.stats-parallax + .section { margin-top: 0; border-radius: 0; }
@media (max-width: 768px) {
.stats-parallax { padding: 4rem 0 16rem; background-attachment: scroll; }
}
@media (max-width: 480px) {
.stats-parallax { padding: 3rem 0 12rem; }
}
/* ═══════════════════════════════════════════
SECTION HEADERS — Line Based
═══════════════════════════════════════════ */
.section-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 3.5rem; flex-wrap: wrap; gap: 1rem; }
.section-header--center { flex-direction: column; align-items: center; text-align: center; }
.section-label { display: inline-flex; align-items: center; gap: .75rem; font-size: .7rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--color-primary-dark); margin-bottom: 1rem; }
.section-label::before { content: ''; width: 24px; height: 1px; background: var(--color-primary); flex-shrink: 0; }
.section-title { position: relative; }
.section-title::after { content: ''; display: block; width: 60px; height: 2px; background: var(--color-primary); margin-top: 1rem; }
.section-header--center .section-title::after { margin-left: auto; margin-right: auto; }
.section-title--light { color: #fff; }
.section-title--light::after { background: var(--color-primary); }
.section-subtitle { display: none; }
.section-link { color: var(--color-dark); font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; display: inline-flex; align-items: center; gap: .4rem; padding: .45rem 1.25rem; background: var(--color-bg-light); border-radius: var(--radius-pill); transition: all var(--transition); }
.section-link:hover { background: var(--color-primary-light); color: var(--color-primary-dark); }
/* ═══════════════════════════════════════════
PROPERTY TABS — Sharp Pills
═══════════════════════════════════════════ */
.property-tabs { display: flex; gap: .5rem; margin-bottom: 2.5rem; flex-wrap: wrap; }
.tab-btn { background: transparent; border: 1px solid var(--color-border); padding: .55rem 1.25rem; font-size: .85rem; font-weight: 500; color: var(--color-text-light); transition: all var(--transition); border-radius: var(--radius-pill); }
.tab-btn:hover { color: var(--color-dark); border-color: var(--color-primary); background: var(--color-primary-light); }
.tab-btn.active { color: var(--color-dark); background: var(--color-primary); border-color: var(--color-primary); font-weight: 600; }
/* ═══════════════════════════════════════════
PROPERTY GRID & CARDS — Sharp & Clean
═══════════════════════════════════════════ */
.property-grid { display: grid; gap: var(--grid-gap); }
.property-grid--3 { grid-template-columns: repeat(3, 1fr); }
.property-grid--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) { .property-grid--3, .property-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .property-grid--3, .property-grid--4 { grid-template-columns: 1fr; } }
.property-card { background: #fff; overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow); border: 1px solid var(--color-border); transition: all var(--transition); }
.property-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.property-card-link { display: block; color: inherit; text-decoration: none; }
.property-card-image { position: relative; aspect-ratio: 3/2; overflow: hidden; background: var(--color-bg-light); }
.property-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.property-card:hover .property-card-image img { transform: scale(1.02); }
.property-card-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--color-bg-light); }
.property-card-badges { position: absolute; top: .75rem; left: .75rem; display: flex; gap: .35rem; }
.badge { padding: .35rem .75rem; font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; border-radius: var(--radius-sm); }
.badge--category { background: var(--color-primary); color: var(--color-dark); }
.badge--type { background: rgba(30,30,30,.85); color: #fff; }
.property-card-photos { position: absolute; bottom: .75rem; right: .75rem; background: rgba(0,0,0,.65); color: #fff; padding: .25rem .65rem; font-size: .75rem; display: flex; align-items: center; gap: .3rem; border-radius: var(--radius-sm); }
.property-card-body { padding: var(--card-padding); }
.property-card-price { font-size: 1.25rem; font-weight: 700; color: var(--color-dark); margin-bottom: .35rem; }
.property-card-title { font-family: var(--font-body); font-size: .875rem; font-weight: 500; line-height: 1.4; margin-bottom: .35rem; color: var(--color-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.property-card-location { display: flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--color-text-light); margin-bottom: .75rem; }
.property-card-features { display: flex; gap: 1rem; flex-wrap: wrap; }
.feature { display: flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--color-text-muted); }
.feature--price-m2 { color: var(--color-text-light); font-weight: 600; margin-left: auto; }
/* ═══════════════════════════════════════════
ABOUT SECTION — Split Layout
═══════════════════════════════════════════ */
.about-section { display: flex; min-height: 520px; max-width: var(--container-max); margin: 0 auto; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg); }
.about-image { width: 50%; flex-shrink: 0; background: var(--color-bg-light) center/cover no-repeat; min-height: 400px; position: relative; overflow: hidden; }
.about-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.about-content { width: 50%; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 3.5rem 4rem; background: #fff; overflow-wrap: break-word; word-wrap: break-word; }
.about-content .section-label { margin-bottom: .5rem; }
.about-content h2 { margin-bottom: 1.5rem; }
.about-content h2::after { content: ''; display: block; width: 50px; height: 2px; background: var(--color-primary); margin-top: .75rem; }
.about-text { color: var(--color-text-light); font-size: .95rem; line-height: 1.8; margin-bottom: 1.5rem; }
.about-features { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; }
.about-feature { display: flex; align-items: flex-start; gap: .75rem; }
.about-feature-icon { width: 20px; height: 20px; flex-shrink: 0; margin-top: 2px; color: var(--color-primary); }
.about-feature-text { font-size: .85rem; font-weight: 500; color: var(--color-dark); }
@media (max-width: 1024px) {
.about-section { flex-direction: column; margin: 0 2rem; }
.about-image { width: 100%; min-height: 320px; }
.about-content { width: 100%; padding: 3rem 2.5rem; }
}
@media (max-width: 768px) {
.about-section { min-height: auto; margin: 0 1.25rem; border-radius: var(--radius-lg); }
.about-image { min-height: 260px; }
.about-content { padding: 2rem 1.5rem; }
.about-features { grid-template-columns: 1fr; gap: .75rem; }
}
@media (max-width: 480px) {
.about-section { margin: 0 1rem; border-radius: var(--radius); }
.about-image { min-height: 200px; }
.about-content { padding: 1.5rem 1.25rem; }
}
/* ═══════════════════════════════════════════
CATEGORY GRID — Sharp Cards
═══════════════════════════════════════════ */
.category-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 0; }
.category-card { background: rgba(255,255,255,.06); border-radius: var(--radius-lg); padding: 2rem 1rem; text-align: center; color: #fff; transition: all var(--transition); text-decoration: none; position: relative; }
.category-card::after { display: none; }
.category-card:hover { background: rgba(255,216,0,.08); color: #fff; transform: translateY(-3px); }
.category-card:hover::after { display: none; }
.category-icon { margin-bottom: 1rem; opacity: .8; line-height: 1; }
.category-icon svg { stroke: var(--color-primary); transition: transform .3s ease, opacity .3s ease; }
.category-card:hover .category-icon svg { transform: scale(1.1); opacity: 1; }
.category-label { font-family: var(--font-body); font-size: .9rem; font-weight: 600; margin-bottom: .25rem; letter-spacing: .01em; color: var(--color-primary); }
.category-count { font-size: .75rem; color: rgba(255,255,255,.4); text-transform: uppercase; letter-spacing: .08em; }
@media (max-width: 768px) { .category-grid { grid-template-columns: repeat(3, 1fr); gap: .75rem; } .category-card { padding: 1.5rem .75rem; } }
@media (max-width: 480px) { .category-grid { grid-template-columns: repeat(2, 1fr); gap: .5rem; } .category-card { padding: 1.25rem .5rem; } .category-label { font-size: .8rem; } }
/* ═══════════════════════════════════════════
PROCESS / HOW IT WORKS
═══════════════════════════════════════════ */
.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--grid-gap); counter-reset: process; }
.process-grid.process-grid--5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1200px) { .process-grid.process-grid--5 { grid-template-columns: repeat(3, 1fr); } }
.process-step { padding: 2.5rem 2rem; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); counter-increment: process; position: relative; transition: all var(--transition); }
.process-step:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.process-step:last-child { }
.process-number { font-family: var(--font-heading); font-size: 3rem; font-weight: 700; color: var(--color-primary); line-height: 1; margin-bottom: 1rem; opacity: .3; }
.process-step h3 { font-family: var(--font-body); font-size: 1rem; font-weight: 700; margin-bottom: .75rem; text-transform: uppercase; letter-spacing: .02em; }
.process-step p { font-size: .875rem; color: var(--color-text-light); line-height: 1.7; }
@media (max-width: 1024px) { .process-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .process-grid { grid-template-columns: 1fr; } .process-step { padding: 2rem 1.5rem; } }
/* ═══════════════════════════════════════════
LOCATIONS GRID — Clean Lines
═══════════════════════════════════════════ */
.locations-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.location-card { padding: 1.5rem 1.25rem; transition: all var(--transition); background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--color-border); }
.location-card:hover { background: var(--color-primary-light); transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.location-name { font-family: var(--font-body); font-size: .95rem; font-weight: 600; margin-bottom: .15rem; }
.location-count { font-size: .8rem; color: var(--color-text-muted); }
@media (max-width: 768px) {
.locations-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}
@media (max-width: 480px) {
.locations-grid { grid-template-columns: 1fr; }
.location-card { padding: 1rem; }
}
/* ═══════════════════════════════════════════
INTERNATIONAL GRID — Country Cards
═══════════════════════════════════════════ */
.international-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.international-card { text-decoration: none; color: #fff; transition: all var(--transition); position: relative; overflow: hidden; border-radius: var(--radius); border: 1px solid rgba(255,255,255,.1); }
.international-card:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,.3); border-color: var(--color-primary); }
.international-image { aspect-ratio: 16/10; overflow: hidden; }
.international-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.international-card:hover .international-image img { transform: scale(1.03); }
.international-content { padding: 1.5rem; }
.international-card:hover .international-link { color: var(--color-primary); }
.international-label { font-family: var(--font-body); font-size: 1.15rem; font-weight: 700; margin-bottom: .5rem; color: #fff; }
.international-desc { font-size: .85rem; line-height: 1.7; color: rgba(255,255,255,.65); margin-bottom: 1rem; }
.international-link { font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--color-primary); transition: color var(--transition); }
@media (max-width: 768px) { .international-grid { grid-template-columns: 1fr; gap: 1rem; } }
/* ═══════════════════════════════════════════
VALUES GRID — Premium
═══════════════════════════════════════════ */
.values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--grid-gap); }
.value-card { padding: 2.5rem 2rem; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); position: relative; transition: all var(--transition); }
.value-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.value-card::before { content: ''; display: block; width: 30px; height: 2px; background: var(--color-primary); margin-bottom: 1.5rem; }
.value-icon { margin-bottom: 1rem; }
.value-card h3 { font-family: var(--font-body); font-size: 1rem; font-weight: 700; margin-bottom: .5rem; text-transform: uppercase; letter-spacing: .03em; }
.value-card p { color: var(--color-text-light); font-size: .875rem; line-height: 1.7; }
@media (max-width: 768px) { .values-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .values-grid { grid-template-columns: 1fr; } }
/* ═══════════════════════════════════════════
TEAM SECTION — Split Layout (dark)
═══════════════════════════════════════════ */
.team-showcase { display: flex; max-width: var(--container-max); margin: 0 auto; border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg); }
.team-image { width: 60%; flex-shrink: 0; background: var(--color-bg-light) center/cover no-repeat; min-height: 520px; }
.team-content { width: 40%; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 3.5rem 3.5rem; background: var(--color-dark); color: #fff; overflow-wrap: break-word; word-wrap: break-word; }
.team-content .section-label { color: var(--color-primary); margin-bottom: .5rem; }
.team-content h2 { color: #fff; margin-bottom: 1.5rem; }
.team-content h2::after { content: ''; display: block; width: 50px; height: 2px; background: var(--color-primary); margin-top: .75rem; }
.team-text { color: rgba(255,255,255,.6); font-size: .95rem; line-height: 1.8; margin-bottom: 2rem; }
.team-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.1); }
.team-stat-number { font-family: var(--font-heading); font-size: 2rem; font-weight: 700; color: var(--color-primary); }
.team-stat-label { font-size: .8rem; color: rgba(255,255,255,.5); text-transform: uppercase; letter-spacing: .08em; }
.team-cta { margin-top: 2rem; }
@media (max-width: 1024px) {
.team-showcase { flex-direction: column; margin: 0 2rem; }
.team-image { width: 100%; min-height: 320px; }
.team-content { width: 100%; padding: 3rem 2.5rem; }
}
@media (max-width: 768px) {
.team-showcase { margin: 0 1.25rem; border-radius: var(--radius-lg); }
.team-image { min-height: 260px; }
.team-content { padding: 2rem 1.5rem; }
.team-stats { gap: 1rem; }
.team-stat-number { font-size: 1.5rem; }
}
@media (max-width: 480px) {
.team-showcase { margin: 0 1rem; border-radius: var(--radius); }
.team-image { min-height: 200px; }
.team-content { padding: 1.5rem 1.25rem; }
}
/* ═══════════════════════════════════════════
TESTIMONIALS
═══════════════════════════════════════════ */
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.testimonial-card { padding: 2.5rem 2rem; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); position: relative; transition: all var(--transition); }
.testimonial-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.testimonial-quote { font-size: .95rem; line-height: 1.8; color: var(--color-text); margin-bottom: 1.5rem; font-style: italic; }
.testimonial-quote::before { content: ''; display: block; width: 30px; height: 2px; background: var(--color-primary); margin-bottom: 1.5rem; }
.testimonial-author { font-weight: 600; font-size: .85rem; color: var(--color-dark); }
.testimonial-role { font-size: .8rem; color: var(--color-text-muted); }
@media (max-width: 768px) {
.testimonials-grid { grid-template-columns: 1fr; }
.testimonial-card { padding: 2rem 1.5rem; }
}
/* ═══════════════════════════════════════════
AWARDS / TRUST BAR
═══════════════════════════════════════════ */
.trust-bar { padding: 3rem 0; background: var(--color-bg-light); }
.trust-grid { display: flex; align-items: center; justify-content: center; gap: 0; flex-wrap: wrap; }
.trust-item { text-align: center; padding: 1rem 2.5rem; opacity: .45; transition: opacity .3s ease; position: relative; }
.trust-item:hover { opacity: 1; }
.trust-item + .trust-item::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 40px; background: var(--color-border); }
.trust-item img { height: 48px; width: auto; max-width: 160px; object-fit: contain; filter: grayscale(1); transition: filter .3s ease; }
.trust-item:hover img { filter: none; }
.trust-item span { display: block; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--color-text-muted); }
.trust-item img + span { margin-top: .5rem; font-weight: 500; }
@media (max-width: 768px) { .trust-item { padding: 1rem 1.5rem; } .trust-item img { height: 36px; } }
@media (max-width: 480px) { .trust-item { padding: .75rem 1rem; } .trust-item + .trust-item::before { height: 28px; } }
/* ═══════════════════════════════════════════
CTA SECTION — Premium Dark
═══════════════════════════════════════════ */
.cta-section { background: transparent; padding: 5rem 0; position: relative; overflow: hidden; }
.cta-section::before { display: none; }
.cta-section > .container { background: var(--color-dark); border-radius: var(--radius-xl); padding: 5rem 3rem; box-shadow: var(--shadow-lg); }
@media (max-width: 768px) {
.cta-section { padding: 3rem 0; }
.cta-section > .container { padding: 3rem 1.5rem; border-radius: var(--radius-lg); }
.cta-title { font-size: clamp(1.4rem, 4vw, 2rem); }
.cta-text { font-size: .9rem; margin-bottom: 1.5rem; }
.cta-buttons { flex-direction: column; align-items: center; }
.cta-buttons .btn { width: 100%; justify-content: center; }
}
@media (max-width: 480px) {
.cta-section { padding: 2rem 0; }
.cta-section > .container { padding: 2.5rem 1.25rem; border-radius: var(--radius); }
}
.cta-inner { max-width: 700px; margin: 0 auto; text-align: center; }
.cta-title { color: #fff; font-size: clamp(1.75rem, 3vw, 2.5rem); margin-bottom: 1rem; }
.cta-text { color: rgba(255,255,255,.55); margin-bottom: 2.5rem; font-size: 1rem; line-height: 1.7; }
.cta-buttons { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
/* ═══════════════════════════════════════════
BLOG POSTS — Sharp
═══════════════════════════════════════════ */
.posts-grid { display: grid; gap: var(--grid-gap); }
.posts-grid--2 { grid-template-columns: repeat(2, 1fr); }
.posts-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 768px) { .posts-grid--2, .posts-grid--3 { grid-template-columns: 1fr; } }
.post-card { background: #fff; overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow); border: 1px solid var(--color-border); transition: all var(--transition); }
.post-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.post-card-link { display: block; color: inherit; text-decoration: none; }
.post-card-image { aspect-ratio: 16/10; overflow: hidden; }
.post-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.post-card:hover .post-card-image img { transform: scale(1.03); }
.post-card-image--placeholder { display: flex; align-items: center; justify-content: center; background: var(--color-bg-light); color: var(--color-border); }
.post-card-content { padding: 1.5rem; }
.post-card-meta { display: flex; align-items: center; gap: .75rem; margin-bottom: .5rem; }
.post-card-date { font-size: .75rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .06em; }
.post-card-category { font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--color-primary-dark); padding: .15rem .5rem; background: var(--color-primary-light); border-radius: var(--radius-sm); }
.post-card-title { font-size: 1rem; margin-bottom: .5rem; }
.post-card-title a { color: var(--color-dark); }
.post-card-title a:hover { color: var(--color-primary-dark); }
.post-card-excerpt { font-size: .85rem; color: var(--color-text-light); line-height: 1.7; margin-bottom: .75rem; }
.post-card-readmore { display: inline-block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-dark); border-bottom: 2px solid var(--color-primary); padding-bottom: .15rem; transition: color var(--transition); }
.post-card:hover .post-card-readmore { color: var(--color-primary-dark); }
/* ═══════════════════════════════════════════
PROPERTY SEARCH — Sharp Form
═══════════════════════════════════════════ */
.property-search { background: #fff; padding: 1.75rem; box-shadow: var(--shadow-lg); border-radius: var(--radius-xl); }
.property-search--hero { max-width: 1000px; margin: 0 auto; }
/* Hero form field sizes */
/* A1: transaction + type + compact location + radius in one row.
"Inwestycje deweloperskie" fits thanks to the 230px type width. */
.property-search--hero .search-field--tx { flex: 0 0 140px; }
.property-search--hero .search-field--type { flex: 0 0 230px; }
.property-search--hero .search-field--loc { flex: 0 0 220px; position: relative; min-width: 180px; }
.property-search--hero .search-field--sm { flex: 0 0 120px; }
@media (max-width: 1000px) {
.property-search--hero .search-field--tx,
.property-search--hero .search-field--type,
.property-search--hero .search-field--loc { flex: 1 1 calc(50% - .75rem); }
}
@media (max-width: 600px) {
.property-search--hero .search-field--tx,
.property-search--hero .search-field--type,
.property-search--hero .search-field--loc { flex: 1 1 100%; }
}
/* Hero own autocomplete dropdown (no Asari plugin) */
.hero-ac-dropdown {
display: none; position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 200;
background: #fff; border: 1px solid #e0e0e0; border-radius: 0 0 8px 8px;
max-height: 320px; overflow-y: auto;
box-shadow: 0 8px 24px rgba(0,0,0,.12);
box-shadow: 0 8px 24px rgba(0,0,0,.12); max-height: 320px; overflow-y: auto;
animation: acSlideDown .2s ease-out;
}
@keyframes acSlideDown { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.hero-ac-dropdown div { padding: .65rem 1rem; font-size: .92rem; color: #1a1a1a; font-weight: 500; cursor: pointer; border-bottom: 1px solid #f3f3f3; line-height: 1.35; transition: background .15s; }
.hero-ac-dropdown div:last-child { border-bottom: none; }
.hero-ac-dropdown div:hover { background: #fffde6; }
.hero-ac-dropdown div span { display: block !important; font-size: .68rem !important; font-weight: 700 !important; color: #b8960c !important; text-transform: uppercase !important; letter-spacing: .06em !important; margin-bottom: .15rem !important; opacity: 1 !important; }
.hero-ac-dropdown p { padding: .65rem 1rem; font-size: .85rem; color: #999; text-align: center; margin: 0; }
.property-search--archive { margin-bottom: 2rem; }
.search-row { display: flex; gap: .75rem; flex-wrap: wrap; align-items: flex-end; }
.search-row--main { margin-bottom: .75rem; }
.search-row--advanced { border-top: var(--line); padding-top: 1rem; margin-top: .5rem; }
.search-field { flex: 1; min-width: 160px; }
.search-field label { display: block; font-size: .7rem; font-weight: 600; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .4rem; }
.search-select, .search-input { width: 100%; padding: .65rem .85rem; border: var(--line); background: var(--color-bg-light); font-size: .9rem; transition: border-color var(--transition); border-radius: var(--radius-sm); font-family: var(--font-body); box-sizing: border-box; height: 42px; }
.search-select { -webkit-appearance: none; appearance: none; background: var(--color-bg-light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .7rem center; padding-right: 2.2rem; cursor: pointer; }
.search-select:focus, .search-input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255,216,0,.15); }
.search-field--range .range-inputs { display: flex; gap: .35rem; align-items: center; }
.search-field--range .range-inputs input { flex: 1; min-width: 0; }
.range-sep { color: var(--color-text-muted); font-size: .85rem; }
.search-field--sm { flex: 0 0 120px; min-width: 100px; }
.search-submit { flex-shrink: 0; min-width: 130px; }
.search-toggle-advanced { background: none; border: none; color: var(--color-text-light); font-size: .75rem; display: flex; align-items: center; gap: .35rem; padding: .25rem 0; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.search-toggle-advanced:hover { color: var(--color-dark); }
@media (max-width: 768px) { .search-field { min-width: 100%; } }
/* ── Radius Search Dropdown ── */
.search-field--radius { min-width: 130px; max-width: 170px; flex: 0 0 auto; }
.search-field--radius select { font-size: .85rem; padding: .6rem .7rem; }
/* ── Location Autocomplete ── */
.ac-wrap { position: relative; width: 100%; }
.ac-list { display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 100; background: #fff; border: var(--line); box-shadow: var(--shadow-lg); list-style: none; margin: 0; padding: .25rem; max-height: 240px; overflow-y: auto; border-radius: var(--radius); }
.ac-list li { padding: .6rem .85rem; font-size: .9rem; color: var(--color-text); cursor: pointer; transition: background .15s ease; border-radius: var(--radius-sm); }
.ac-list li:hover, .ac-list li.ac-active { background: var(--color-primary-light); }
.ac-list li strong { font-weight: 700; color: var(--color-dark); }
/* ═══════════════════════════════════════════
ARCHIVE TOOLBAR
═══════════════════════════════════════════ */
.archive-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-wrap: wrap; gap: .5rem; padding: .75rem 0; }
.archive-count { font-size: .85rem; color: var(--color-text-light); }
.archive-sort { display: flex; align-items: center; gap: .5rem; font-size: .85rem; }
.sort-select { padding: .45rem .85rem; border: var(--line); font-size: .85rem; border-radius: var(--radius-sm); }
/* ── Leaflet / Asari Map overrides ── */
.leaflet-control-zoom a { background: #fff !important; color: var(--color-dark) !important; border-radius: var(--radius-sm) !important; }
.leaflet-control-attribution { font-size: .65rem; }
.asariplug_sengine_mapsearch .leaflet-top { z-index: 400; }
.asariplug_sengine_mapsearch .leaflet-popup-content-wrapper { border-radius: var(--radius) !important; box-shadow: var(--shadow-lg) !important; }
.asariplug_sengine_mapsearch .leaflet-popup-content { margin: 0 !important; }
.asariplug_sengine_mapsearch .leaflet-popup-close-button { z-index: 5; }
.asariplug_sengine_mapsearch .leaflet-popup.infobox-wrapper { bottom: 250px !important; }
/* ═══════════════════════════════════════════
PROPERTY SINGLE — Hero-First Design
═══════════════════════════════════════════ */
/* ── Offer Hero ── */
.offer-hero { position: relative; min-height: 55vh; background-size: cover; background-position: center; background-color: var(--color-dark); display: flex; align-items: flex-end; overflow: hidden; margin-top: -90px; padding-top: 90px; }
body.admin-bar .offer-hero { margin-top: -122px; padding-top: 122px; }
@media (max-width: 782px) { body.admin-bar .offer-hero { margin-top: -136px; padding-top: 136px; } }
.offer-hero-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.2) 40%, rgba(0,0,0,.05) 100%); z-index: 1; }
.offer-hero-content { position: relative; z-index: 2; width: 100%; padding-bottom: 3rem; }
.offer-hero-tags { display: flex; gap: .5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.offer-hero-tag { padding: .35rem .85rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; border-radius: var(--radius-pill); backdrop-filter: blur(4px); }
.offer-hero-tag--category { background: var(--color-primary); color: var(--color-dark); }
.offer-hero-tag--type { background: rgba(255,255,255,.15); color: #fff; }
.offer-hero-tag--id { background: rgba(255,255,255,.1); color: rgba(255,255,255,.7); }
.offer-hero-title { color: #fff; font-size: 2rem; font-weight: 700; margin-bottom: .75rem; text-shadow: 0 2px 8px rgba(0,0,0,.3); }
.offer-hero-location { display: flex; align-items: center; gap: .5rem; color: rgba(255,255,255,.8); font-size: .95rem; margin-bottom: 1.25rem; }
.offer-hero-location svg { opacity: .7; flex-shrink: 0; }
.offer-hero-price { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.offer-hero-price-main { font-family: var(--font-heading); font-size: 2.25rem; font-weight: 700; color: var(--color-primary); text-shadow: 0 2px 12px rgba(0,0,0,.4); }
.offer-hero-price-m2 { font-size: .95rem; color: rgba(255,255,255,.6); }
.offer-hero-gallery-btn { position: absolute; bottom: 1.5rem; right: 2rem; z-index: 3; display: flex; align-items: center; gap: .5rem; padding: .6rem 1.25rem; background: rgba(0,0,0,.6); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.15); color: #fff; font-size: .85rem; font-weight: 500; cursor: pointer; transition: all var(--transition); border-radius: var(--radius-pill); }
.offer-hero-gallery-btn:hover { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
@media (max-width: 768px) {
.offer-hero { min-height: 45vh; }
.offer-hero-title { font-size: 1.5rem; }
.offer-hero-price-main { font-size: 1.75rem; }
.offer-hero-gallery-btn { bottom: 1rem; right: 1rem; padding: .5rem 1rem; font-size: .8rem; }
}
@media (max-width: 480px) {
.offer-hero { min-height: 40vh; }
.offer-hero-content { padding-bottom: 2rem; }
.offer-hero-title { font-size: 1.25rem; }
}
/* ── Overview Bar ── */
.offer-overview { background: #fff; border-bottom: 1px solid var(--color-border); padding: 1.5rem 0; }
.offer-overview-grid { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; }
.offer-overview-features { display: flex; flex-wrap: wrap; gap: 0; flex: 1; min-width: 0; }
.offer-overview-feature { padding: .25rem 1.5rem; text-align: center; border-right: 1px solid var(--color-border); flex-shrink: 1; }
.offer-overview-feature:first-child { padding-left: 0; }
.offer-overview-feature:last-child { border-right: none; }
.offer-overview-feature-value { display: block; font-size: 1.15rem; font-weight: 700; color: var(--color-dark); line-height: 1.2; }
.offer-overview-feature-label { display: block; font-size: .7rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .04em; margin-top: .2rem; }
.offer-overview-agent { display: flex; align-items: center; gap: .75rem; flex-shrink: 0; padding-left: 2rem; border-left: 1px solid var(--color-border); }
.offer-overview-agent-photo { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; border: 2px solid var(--color-primary); flex-shrink: 0; }
.offer-overview-agent-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.offer-overview-agent-info { display: flex; flex-direction: column; }
.offer-overview-agent-label { font-size: .65rem; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); }
.offer-overview-agent-name { font-size: .85rem; font-weight: 600; color: var(--color-dark); white-space: nowrap; }
.offer-overview-agent-call { white-space: nowrap; }
.offer-overview-agent-call svg { margin-right: .25rem; vertical-align: middle; }
@media (max-width: 768px) {
.offer-overview-agent { padding-left: 0; border-left: none; padding-top: 1rem; border-top: 1px solid var(--color-border); width: 100%; }
.offer-overview-features { flex-wrap: wrap; overflow-x: visible; gap: .5rem; }
.offer-overview-feature { padding: .5rem 1rem; border-right: none; border: 1px solid var(--color-border); border-radius: var(--radius-sm); flex-shrink: 1; }
}
/* ── Gallery Grid ── */
.offer-gallery-section { background: var(--color-bg-light); padding: 2.5rem 0; }
.offer-gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.offer-gallery-item { position: relative; aspect-ratio: 4/3; overflow: hidden; border: none; padding: 0; background: var(--color-dark); cursor: pointer; border-radius: var(--radius-sm); transition: all var(--transition); }
.offer-gallery-item:hover { transform: scale(1.02); z-index: 1; box-shadow: var(--shadow-hover); }
.offer-gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.offer-gallery-item:hover img { transform: scale(1.05); }
.offer-gallery-item--hidden { display: none; }
.offer-gallery-more { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.55); color: #fff; font-size: 1.5rem; font-weight: 700; pointer-events: none; }
@media (max-width: 768px) { .offer-gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .offer-gallery-grid { grid-template-columns: repeat(2, 1fr); gap: .35rem; } }
/* ── Property Layout (Content + Sidebar) ── */
.property-layout { display: grid; grid-template-columns: 1fr 380px; gap: 3rem; padding: 3rem 0; }
@media (max-width: 1024px) { .property-layout { grid-template-columns: 1fr; } }
.property-description { margin-bottom: 2.5rem; padding: 2rem; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.property-description h2 { margin-bottom: 1.25rem; font-size: 1.3rem; padding-bottom: .75rem; border-bottom: var(--line); }
.property-description-text { font-size: .95rem; line-height: 1.8; color: var(--color-text); }
.property-description-text p { margin-bottom: .5em; }
.property-description-text p:empty { display: none; }
.property-description-text p:last-child { margin-bottom: 0; }
.property-description-text br + br { display: none; }
.property-details-table { margin-bottom: 2.5rem; padding: 2rem; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.property-details-table h2 { margin-bottom: 1.25rem; font-size: 1.3rem; padding-bottom: .75rem; border-bottom: var(--line); }
.details-table { width: 100%; border-collapse: collapse; }
.details-table tr { border-bottom: var(--line); }
.details-table tr:last-child { border-bottom: none; }
.details-table th, .details-table td { padding: .85rem 1.25rem; text-align: left; font-size: .9rem; }
.details-table th { font-weight: 600; color: var(--color-text-light); width: 35%; }
.details-table td { color: var(--color-dark); font-weight: 500; }
.details-table tr:hover { background: var(--color-bg-light); }
/* ── Property Sidebar ── */
.property-sidebar { position: sticky; top: 100px; align-self: start; }
.agent-card { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 2rem; text-align: center; margin-bottom: 1.5rem; }
.agent-photo { width: 140px; height: 180px; overflow: hidden; margin: 0 auto 1rem; border: 2px solid var(--color-primary); border-radius: var(--radius-lg); }
.agent-photo img { width: 100%; height: 100%; object-fit: cover; }
.agent-name { font-family: var(--font-body); font-size: 1.05rem; font-weight: 600; margin-bottom: .25rem; }
.agent-position { font-size: .8rem; color: var(--color-text-muted); margin-bottom: .25rem; }
.agent-license { font-size: .75rem; color: var(--color-text-muted); margin-bottom: 1.25rem; padding-bottom: 1.25rem; border-bottom: var(--line); }
.agent-contact { display: flex; flex-direction: column; gap: .5rem; }
.agent-contact .btn svg { margin-right: .35rem; vertical-align: middle; }
.property-quick-actions { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1.5rem; }
.property-quick-actions .btn { display: flex; align-items: center; justify-content: center; gap: .5rem; }
.sidebar-contact-form { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 2rem; margin-bottom: 1.5rem; }
.sidebar-contact-form h3 { font-family: var(--font-body); font-size: .95rem; margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: var(--line); text-transform: uppercase; letter-spacing: .04em; }
.form-group { margin-bottom: .75rem; }
.form-input { width: 100%; padding: .75rem 1rem; border: var(--line); font-size: .9rem; transition: all var(--transition); resize: vertical; border-radius: var(--radius-sm); }
.form-input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255,216,0,.15); }
.form-group--consent { font-size: .75rem; color: var(--color-text-muted); }
.form-group--consent label { display: flex; gap: .5rem; align-items: flex-start; cursor: pointer; }
.form-group--consent input { margin-top: 3px; flex-shrink: 0; }
.property-share { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); padding: 1.5rem; margin-bottom: 1.5rem; }
.property-share h3 { font-family: var(--font-body); font-size: .85rem; margin-bottom: .75rem; text-transform: uppercase; letter-spacing: .04em; }
.share-buttons { display: flex; gap: .5rem; }
.share-btn { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .85rem; font-size: .8rem; border: var(--line); background: var(--color-bg-light); cursor: pointer; transition: all var(--transition); color: var(--color-text); text-decoration: none; border-radius: var(--radius-sm); }
.share-btn:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.offer-back-link { margin-top: .5rem; display: flex; align-items: center; justify-content: center; gap: .5rem; }
/* ── Gallery Lightbox ── */
.gallery-lightbox-overlay { position: fixed; inset: 0; z-index: 100000; background: rgba(0,0,0,.94); display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease; }
.gallery-lightbox-overlay.active { opacity: 1; visibility: visible; }
.lightbox-close { position: absolute; top: 1rem; right: 1rem; z-index: 100001; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); color: #fff; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .2s ease; border-radius: 50%; }
.lightbox-close:hover { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
.lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 100001; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); color: #fff; width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .2s ease; border-radius: 50%; }
.lightbox-nav:hover { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
.lightbox-prev { left: 1.5rem; }
.lightbox-next { right: 1.5rem; }
.lightbox-image-wrap { max-width: calc(100vw - 140px); max-height: calc(100vh - 120px); display: flex; align-items: center; justify-content: center; }
.lightbox-img { max-width: 100%; max-height: calc(100vh - 120px); object-fit: contain; user-select: none; border-radius: var(--radius-sm); }
.lightbox-counter { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,.7); font-size: .85rem; font-weight: 500; background: rgba(0,0,0,.5); padding: .4rem 1.25rem; border-radius: var(--radius-pill); }
.lightbox-thumbs { position: absolute; bottom: 4rem; left: 50%; transform: translateX(-50%); display: flex; gap: .35rem; max-width: 80vw; overflow-x: auto; padding: .5rem; }
.lightbox-thumb { width: 60px; height: 40px; border-radius: 4px; overflow: hidden; cursor: pointer; border: 2px solid transparent; opacity: .5; transition: all .2s ease; flex-shrink: 0; padding: 0; background: none; }
.lightbox-thumb.active, .lightbox-thumb:hover { opacity: 1; border-color: var(--color-primary); }
.lightbox-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 768px) {
.lightbox-nav { width: 40px; height: 40px; }
.lightbox-prev { left: .5rem; }
.lightbox-next { right: .5rem; }
.lightbox-close { top: .5rem; right: .5rem; width: 40px; height: 40px; }
.lightbox-image-wrap { max-width: calc(100vw - 20px); }
.lightbox-thumbs { display: none; }
}
/* ── Property Map ── */
.property-map-section { margin-bottom: 2.5rem; padding: 2rem; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.property-map-section h2 { margin-bottom: 1rem; font-size: 1.3rem; padding-bottom: .75rem; border-bottom: var(--line); }
.property_map { width: 100%; min-height: 400px; border-radius: var(--radius); overflow: hidden; background: var(--color-bg-light); }
@media (max-width: 768px) { .property_map { min-height: 280px; } }
/* ── Video/Tour embed ── */
.property-media { margin-bottom: 2.5rem; padding: 2rem; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.property-media h2 { margin-bottom: 1.25rem; font-size: 1.3rem; padding-bottom: .75rem; border-bottom: var(--line); }
.property-tour { margin-top: 1.5rem; }
.property-tour h3 { font-size: 1rem; margin-bottom: .75rem; }
.property-tour .btn { display: inline-flex; align-items: center; gap: .5rem; }
.video-embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: var(--radius); }
.video-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; }
/* ── Contact Form (inline, above related) ── */
.property-contact-form { margin: 2.5rem 0; padding: 2rem; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.property-contact-form h2 { font-size: 1.3rem; margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: var(--line); }
.property-contact-form--full { margin-top: 0; padding: 2.5rem 3rem; }
@media (max-width: 768px) { .property-contact-form--full { padding: 2rem; } }
@media (max-width: 480px) { .property-contact-form { padding: 1.5rem 1rem; margin: 2rem 0; } .property-contact-form h2 { font-size: 1.1rem; } }
/* ── Contextual Links ── */
.ddre-contextual-links { margin: 2.5rem 0; padding-top: 2rem; border-top: var(--line); }
.contextual-links-title { font-family: var(--font-body); font-size: 1rem; margin-bottom: 1rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.contextual-links-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: .75rem; }
.contextual-link { display: flex; align-items: center; gap: .75rem; padding: .85rem 1.25rem; transition: all var(--transition); text-decoration: none; color: var(--color-text); border: var(--line); border-radius: var(--radius); }
.contextual-link:hover { background: var(--color-primary-light); color: var(--color-dark); }
.contextual-link-text { font-size: .875rem; font-weight: 500; }
.contextual-link-count { font-size: .8rem; color: var(--color-text-muted); }
/* ── Related Properties ── */
.ddre-related-properties { margin: 2.5rem 0; padding-top: 2rem; border-top: var(--line); }
.related-title { font-family: var(--font-body); font-size: 1rem; margin-bottom: 1.5rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
a.property-card { display: block; color: inherit; text-decoration: none; }
/* ── Location Type Pills ── */
.location-type-links { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.type-link-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1.25rem; font-size: .85rem; color: var(--color-text); transition: all var(--transition); text-decoration: none; border: var(--line); border-radius: var(--radius-pill); background: #fff; }
.type-link-pill:hover { background: var(--color-primary-light); color: var(--color-dark); }
.pill-count { font-weight: 600; color: var(--color-primary-dark); }
/* ── Breadcrumbs ── */
/* position+z-index: kolejna sekcja (np. .section--light na /sprzedaj-nieruchomosc/wycena/)
ma margin-top: -1.5rem + z-index: 1 — bez position+z-index na breadcrumbach jej tło
przykrywałoby dolną część breadcrumbów. */
.ddre-breadcrumbs { background: var(--color-bg-light); padding: .85rem 0; border-bottom: 1px solid var(--color-border); position: relative; z-index: 5; }
.breadcrumbs-list { display: flex; align-items: center; flex-wrap: wrap; gap: 0; max-width: var(--container-max); margin: 0 auto; padding: 0 2rem; }
.breadcrumbs-item { font-size: .82rem; }
.breadcrumbs-item a { color: var(--color-text-light); text-decoration: none; transition: color .2s ease; }
.breadcrumbs-item a:hover { color: var(--color-primary-dark); }
.breadcrumbs-item:last-child span { color: var(--color-dark); font-weight: 600; }
.breadcrumbs-separator { color: var(--color-text-muted); font-size: .75rem; margin: 0 .5rem; }
/* Offer page breadcrumbs - more prominent */
.property-single .ddre-breadcrumbs { background: #fff; border-bottom: 1px solid var(--color-border); }
.property-single .breadcrumbs-item a { color: var(--color-text); }
.property-single .breadcrumbs-item a:hover { color: var(--color-primary-dark); }
/* ── Pagination ── */
.pagination { margin-top: 2.5rem; display: flex; justify-content: center; }
.pagination .nav-links { display: flex; gap: .5rem; }
.pagination a, .pagination span { display: flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 .5rem; font-size: .9rem; border: var(--line); background: #fff; color: var(--color-text); transition: all var(--transition); text-decoration: none; border-radius: var(--radius-sm); }
.pagination a:hover { background: var(--color-primary-light); border-color: var(--color-primary); }
.pagination .current { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-dark); font-weight: 700; }
/* ═══════════════════════════════════════════
PAGE TEMPLATES — Subpages
═══════════════════════════════════════════ */
/* Page Hero Banner */
.page-hero { background: var(--color-bg-light); padding: 3.5rem 0; color: var(--color-dark); position: relative; overflow: hidden; margin-top: -90px; padding-top: calc(90px + 3.5rem); text-align: center; }
.page-hero .container { display: flex; flex-direction: column; align-items: center; }
.page-hero .section-label { display: none; }
.page-hero h1 { color: var(--color-dark); margin-bottom: 0; font-size: 3rem; text-align: center; }
.page-hero h1::after { content: ''; display: block; width: 80px; height: 3px; background: var(--color-primary); margin: 1.25rem auto 0; }
.page-hero p { display: none; }
body.admin-bar .page-hero { margin-top: -122px; padding-top: calc(122px + 3.5rem); }
@media (max-width: 782px) { body.admin-bar .page-hero { margin-top: -136px; padding-top: calc(136px + 3.5rem); } }
/* Hero with media (video or image) */
.page-hero--media { min-height: 70vh; display: flex; align-items: center; justify-content: center; background-size: cover; background-position: center; color: #fff; }
.page-hero--media .container { padding: 0; }
.page-hero--media h1 { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.4); font-size: 3.5rem; }
.page-hero--media h1::after { background: var(--color-primary); }
.page-hero--media .hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.page-hero--media::before { content: ''; position: absolute; inset: 0; background: rgba(26,35,50,.45); z-index: 1; }
.page-hero--media .container { position: relative; z-index: 2; }
@media (max-width: 768px) {
.page-hero { padding: 2.5rem 0; margin-top: -90px; padding-top: calc(90px + 2.5rem); }
.page-hero h1 { font-size: 1.75rem; }
.page-hero--media { min-height: 55vh; }
.page-hero--media h1 { font-size: 2rem; }
}
@media (max-width: 480px) {
.page-hero { padding: 2rem 0; margin-top: -90px; padding-top: calc(90px + 2rem); }
.page-hero h1 { font-size: 1.5rem; }
.page-hero--media { min-height: 45vh; }
.page-hero--media h1 { font-size: 1.5rem; }
}
/* About Page */
.about-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
.about-intro-image { position: relative; }
.about-intro-image img { width: 100%; border-radius: var(--radius-lg); }
.about-intro-image::after { display: none; }
.about-intro-text h2::after { content: ''; display: block; width: 50px; height: 2px; background: var(--color-primary); margin-top: .75rem; }
.about-intro-text p { color: var(--color-text-light); line-height: 1.8; margin-top: 1rem; }
@media (max-width: 1024px) { .about-intro { grid-template-columns: 1fr; gap: 2rem; } }
@media (max-width: 480px) { .about-intro { gap: 1.5rem; } .about-intro-text p { font-size: .9rem; } }
/* Services Grid */
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.service-card { padding: 2.5rem 2rem; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); transition: all var(--transition); }
.service-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.service-icon { width: 48px; height: 48px; margin-bottom: 1.5rem; color: var(--color-primary); }
.service-card h3 { font-family: var(--font-body); font-size: 1rem; font-weight: 700; margin-bottom: .75rem; text-transform: uppercase; letter-spacing: .02em; }
.service-card p { font-size: .875rem; color: var(--color-text-light); line-height: 1.7; }
@media (max-width: 768px) { .services-grid { grid-template-columns: 1fr; } .service-card { padding: 2rem 1.5rem; } }
/* Contact Page */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.contact-form-section { padding: 3rem; border-right: var(--line); }
.contact-info-section { padding: 3rem; }
.contact-form-section h2, .contact-info-section h2 { font-size: 1.3rem; margin-bottom: 1.5rem; padding-bottom: .75rem; border-bottom: var(--line); }
@media (max-width: 1024px) { .contact-grid { grid-template-columns: 1fr; } .contact-form-section { border-right: none; border-bottom: var(--line); } }
@media (max-width: 768px) { .contact-form-section, .contact-info-section { padding: 2rem 1.5rem; } .contact-form-section h2, .contact-info-section h2 { font-size: 1.1rem; } }
@media (max-width: 480px) { .contact-form-section, .contact-info-section { padding: 1.5rem 1rem; } }
.offices-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--grid-gap); margin-top: 2rem; }
.office-card { padding: 2rem; border-radius: var(--radius-lg); background: var(--color-bg-light); transition: all var(--transition); }
.office-card:hover { box-shadow: var(--shadow); }
.office-name { font-family: var(--font-body); font-weight: 700; font-size: .95rem; margin-bottom: .5rem; text-transform: uppercase; letter-spacing: .02em; }
.office-name::after { content: ''; display: block; width: 25px; height: 2px; background: var(--color-primary); margin-top: .5rem; }
.office-detail { font-size: .85rem; color: var(--color-text-light); margin-bottom: .25rem; line-height: 1.6; }
.office-detail a { color: var(--color-primary-dark); font-weight: 500; }
/* Sell Page */
.sell-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.sell-benefit { padding: 2rem; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); text-align: center; transition: all var(--transition); }
.sell-benefit:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.sell-benefit-number { font-family: var(--font-heading); font-size: 2.5rem; font-weight: 700; color: var(--color-primary); line-height: 1; margin-bottom: .5rem; }
.sell-benefit h3 { font-family: var(--font-body); font-size: .9rem; font-weight: 700; margin-bottom: .5rem; text-transform: uppercase; letter-spacing: .02em; }
.sell-benefit p { font-size: .85rem; color: var(--color-text-light); line-height: 1.7; }
@media (max-width: 768px) { .sell-benefits { grid-template-columns: 1fr; } .sell-benefit { padding: 1.5rem 1.25rem; } .sell-benefit-number { font-size: 2rem; } }
/* Team Page */
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap); }
.team-member { position: relative; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); overflow: hidden; transition: all var(--transition); }
.team-member:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.team-member-photo { position: relative; aspect-ratio: 3/4; overflow: hidden; background: var(--color-bg-light); }
.team-member-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.4,0,.2,1); }
.team-member:hover .team-member-photo img { transform: scale(1.03); }
.team-member-photo .no-photo { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
/* Hover overlay */
.team-member-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(26,35,50,.92) 30%, rgba(26,35,50,.4) 65%, transparent); opacity: 0; transition: opacity .35s cubic-bezier(.4,0,.2,1); display: flex; flex-direction: column; justify-content: flex-end; padding: 1.5rem; color: #fff; }
.team-member:hover .team-member-overlay { opacity: 1; }
.team-member-overlay-desc { font-size: .85rem; line-height: 1.6; color: rgba(255,255,255,.8); margin-bottom: .75rem; }
.team-member-overlay-contact { display: flex; flex-direction: column; gap: .25rem; }
.team-member-overlay-contact a { color: var(--color-primary); font-size: .85rem; font-weight: 500; text-decoration: none; }
.team-member-overlay-contact a:hover { text-decoration: underline; }
/* Info below photo */
.team-member-info { padding: 1.25rem 1.5rem; }
.team-member-name { font-family: var(--font-body); font-weight: 700; font-size: 1.05rem; margin-bottom: .2rem; }
.team-member-link { color: inherit; text-decoration: none; }
.team-member-link::after { content: ''; position: absolute; inset: 0; z-index: 0; }
.team-member-role { font-size: .75rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: .75rem; }
.team-member-actions { display: flex; gap: .5rem; position: relative; z-index: 1; flex-wrap: wrap; }
.team-member-actions .btn { font-size: .7rem; padding: .4rem 1rem; }
/* Office group header inside grid */
.team-grid + .team-grid { margin-top: 3rem; }
.team-office-header { grid-column: 1 / -1; padding: 1.25rem 1.5rem; background: var(--color-bg-light); border-left: 4px solid var(--color-primary); border-radius: 0 var(--radius) var(--radius) 0; margin-bottom: .5rem; }
.team-office-header:first-child { }
.team-office-header h3 { font-family: var(--font-heading); font-size: 1.35rem; font-weight: 700; letter-spacing: -.01em; color: var(--color-dark); text-transform: none; }
@media (max-width: 1024px) { .team-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
.team-grid { grid-template-columns: 1fr; }
.team-member-overlay { opacity: 1; background: linear-gradient(to top, rgba(26,35,50,.85) 25%, transparent); }
}
/* Valuation Page */
.valuation-form-wrapper { max-width: 800px; margin: 0 auto; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.valuation-form-header { background: var(--color-dark); color: #fff; padding: 2rem 2.5rem; }
.valuation-form-header h2 { color: #fff; font-size: 1.3rem; }
.valuation-form-body { padding: 2.5rem; }
.valuation-disclaimer { margin-top: 1.25rem; font-size: .78rem; color: rgba(255,255,255,.45); line-height: 1.6; border-top: 1px solid rgba(255,255,255,.1); padding-top: 1rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
@media (max-width: 640px) {
.form-row { grid-template-columns: 1fr; }
.valuation-form-header { padding: 1.5rem 1.25rem; }
.valuation-form-body { padding: 1.5rem 1.25rem; }
.valuation-form-header h2 { font-size: 1.1rem; }
}
.form-label { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin-bottom: .35rem; }
/* ═══════════════════════════════════════════
BLOG SINGLE
═══════════════════════════════════════════ */
.blog-layout { display: grid; grid-template-columns: 1fr 340px; gap: 3rem; }
@media (max-width: 1024px) { .blog-layout { grid-template-columns: 1fr; } }
.blog-main { min-width: 0; }
.blog-header { margin-bottom: 2rem; padding-bottom: 2rem; border-bottom: var(--line); }
.blog-title { margin-bottom: .75rem; }
.blog-meta { font-size: .8rem; color: var(--color-text-muted); display: flex; justify-content: space-between; align-items: center; gap: 1rem; text-transform: uppercase; letter-spacing: .04em; flex-wrap: wrap; }
.blog-meta-left { display: flex; align-items: center; gap: 1rem; }
.blog-meta-right { display: flex; align-items: center; }
.blog-author-inline { display: flex; align-items: center; gap: .5rem; }
.blog-author-inline img { width: 32px; height: 32px; border-radius: 50%; }
.blog-author-inline span { font-weight: 600; color: var(--color-dark); }
.blog-reading-time { display: inline-flex; align-items: center; gap: .3rem; color: var(--color-text-muted); }
.blog-categories-top { display: flex; gap: 0; margin-bottom: 1rem; }
.blog-category-badge { display: inline-block; padding: .3rem .75rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; background: var(--color-primary); color: var(--color-dark); text-decoration: none; transition: background var(--transition); border-radius: var(--radius-pill); }
.blog-category-badge:hover { background: var(--color-primary-dark); color: var(--color-dark); }
.blog-featured-image { margin-bottom: 2rem; overflow: hidden; }
.entry-content { font-size: 1rem; line-height: 1.8; }
.entry-content p { margin-bottom: 1.25rem; }
.entry-content h2, .entry-content h3 { margin: 2rem 0 1rem; }
.entry-content ul, .entry-content ol { margin: 1rem 0; padding-left: 1.5rem; list-style: disc; }
.entry-content ol { list-style: decimal; }
.entry-content li { margin-bottom: .5rem; }
.entry-content img { margin: 1.5rem 0; }
.entry-content blockquote { margin: 2rem 0; padding: 1.5rem 2rem; border-left: 3px solid var(--color-primary); background: var(--color-bg-light); font-style: italic; font-size: 1.05rem; }
.entry-content blockquote p:last-child { margin-bottom: 0; }
/* Blog Footer: Tags & Share */
.blog-footer { margin-top: 2.5rem; padding-top: 2rem; border-top: var(--line); }
.blog-tags { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.blog-tags-label { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); }
.blog-tag { display: inline-block; padding: .3rem .75rem; font-size: .8rem; border: var(--line); color: var(--color-text); text-decoration: none; transition: all var(--transition); border-radius: var(--radius-pill); }
.blog-tag:hover { border-color: var(--color-primary); background: var(--color-primary-light); color: var(--color-dark); }
.blog-share { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.blog-share-label { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); }
/* Author Box */
.blog-author-box { display: flex; gap: 1.5rem; padding: 2rem; margin-top: 2.5rem; background: var(--color-bg-light); border-radius: var(--radius-lg); }
.blog-author-avatar img { width: 80px; height: 80px; border-radius: 50%; border: 2px solid var(--color-primary); }
.blog-author-label { display: block; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--color-text-muted); margin-bottom: .25rem; }
.blog-author-name { font-family: var(--font-body); font-size: 1.1rem; font-weight: 700; margin-bottom: .35rem; }
.blog-author-bio { font-size: .9rem; color: var(--color-text-light); line-height: 1.7; }
@media (max-width: 640px) { .blog-author-box { flex-direction: column; align-items: center; text-align: center; } }
/* Post Navigation */
.blog-post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 2.5rem; background: var(--color-border); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.blog-post-nav-item { display: block; padding: 1.5rem; text-decoration: none; transition: background var(--transition); background: #fff; }
.blog-post-nav-item--prev { }
.blog-post-nav-item--next { text-align: right; }
.blog-post-nav-item:hover { background: var(--color-bg-light); }
.blog-post-nav-label { display: block; font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin-bottom: .35rem; }
.blog-post-nav-title { display: block; font-size: .9rem; font-weight: 600; color: var(--color-dark); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 640px) { .blog-post-nav { grid-template-columns: 1fr; } .blog-post-nav-item--prev { border-right: none; border-bottom: var(--line); } .blog-post-nav-item--next { text-align: left; } }
/* Related Posts */
.blog-related { margin-top: 3rem; padding-top: 3rem; border-top: var(--line); }
/* Blog Comments */
.blog-comments-section { margin-top: 3rem; padding-top: 3rem; border-top: var(--line); }
.comment-respond { margin-bottom: 2rem; }
.comment-reply-title { font-family: var(--font-body); font-size: 1.1rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; margin-bottom: 1.5rem; padding-bottom: .75rem; border-bottom: var(--line-gold); }
.comment-form label { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin-bottom: .35rem; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea { width: 100%; padding: .75rem 1rem; border: var(--line); font-size: .9rem; font-family: var(--font-body); transition: all var(--transition); border-radius: var(--radius-sm); }
.comment-form input:focus, .comment-form textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255,216,0,.15); }
.comment-form .form-submit input { background: var(--color-primary); color: var(--color-dark); border: 2px solid var(--color-primary); border-radius: var(--radius-pill); padding: .85rem 2rem; font-weight: 600; font-size: .875rem; text-transform: uppercase; letter-spacing: .02em; cursor: pointer; transition: all var(--transition); }
.comment-form .form-submit input:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); }
.comment-form p { margin-bottom: 1rem; }
.comment-list { list-style: none; padding: 0; }
.comment-list .comment { padding: 1.5rem 0; border-bottom: var(--line); }
.comment-list .comment-body { display: flex; gap: 1rem; }
.comment-list .comment-author img { border-radius: 50%; width: 48px; height: 48px; }
.comment-list .comment-meta { font-size: .8rem; color: var(--color-text-muted); margin-bottom: .5rem; }
.comment-list .comment-content p { margin-bottom: .5rem; font-size: .95rem; }
/* Blog Single Hero */
.blog-hero { position: relative; min-height: 55vh; background-size: cover; background-position: center; background-color: var(--color-dark); display: flex; align-items: flex-end; overflow: hidden; margin-top: -90px; padding-top: 90px; }
body.admin-bar .blog-hero { margin-top: -122px; padding-top: 122px; }
@media (max-width: 782px) { body.admin-bar .blog-hero { margin-top: -136px; padding-top: 136px; } }
.blog-hero-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.2) 40%, rgba(0,0,0,.05) 100%); z-index: 1; }
.blog-hero-content { position: relative; z-index: 2; width: 100%; padding-bottom: 3rem; max-width: 800px; }
.blog-hero-tags { display: flex; gap: .5rem; margin-bottom: 1rem; flex-wrap: wrap; }
.blog-hero-tag { display: inline-block; padding: .35rem .85rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; border-radius: var(--radius-pill); background: var(--color-primary); color: var(--color-dark); text-decoration: none; backdrop-filter: blur(4px); transition: background var(--transition); }
.blog-hero-tag:hover { background: var(--color-primary-dark); color: var(--color-dark); }
.blog-hero-title { color: #fff; font-size: clamp(1.75rem, 4vw, 2.5rem); font-weight: 700; margin-bottom: .75rem; text-shadow: 0 2px 8px rgba(0,0,0,.3); line-height: 1.2; }
.blog-hero-meta { display: flex; align-items: center; gap: .75rem; font-size: .85rem; color: rgba(255,255,255,.75); }
.blog-hero-meta time { color: rgba(255,255,255,.85); }
.blog-hero-meta-sep { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.4); }
.blog-hero-meta .blog-reading-time { color: rgba(255,255,255,.75); }
.blog-hero-meta .blog-reading-time svg { stroke: rgba(255,255,255,.6); }
@media (max-width: 768px) {
.blog-hero { min-height: 45vh; }
.blog-hero-content { padding-bottom: 2rem; }
.blog-hero-title { font-size: 1.5rem; }
}
@media (max-width: 480px) {
.blog-hero { min-height: 40vh; }
.blog-hero-title { font-size: 1.25rem; }
}
/* Blog Single — Full Width (no sidebar) */
.blog-single--full { max-width: 800px; margin: 0 auto; }
/* Blog Sidebar Widgets */
.blog-sidebar .widget { margin-bottom: 2rem; padding-bottom: 2rem; border-bottom: var(--line); }
.blog-sidebar .widget:last-child { border-bottom: none; }
.blog-search-form { display: block; }
.blog-search-input-wrap { display: flex; border: var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.blog-search-input-wrap .form-input { flex: 1; border: none; padding: .65rem .85rem; font-size: .9rem; }
.blog-search-input-wrap .form-input:focus { outline: none; }
.blog-search-btn { flex-shrink: 0; width: 44px; display: flex; align-items: center; justify-content: center; background: var(--color-primary); border: none; color: var(--color-dark); cursor: pointer; transition: background var(--transition); }
.blog-search-btn:hover { background: var(--color-primary-dark); }
.widget-list { list-style: none; padding: 0; margin: 0; }
.widget-list li { margin-bottom: 0; }
.widget-list li a { display: flex; justify-content: space-between; align-items: center; padding: .6rem 0; border-bottom: 1px solid var(--color-border); font-size: .9rem; color: var(--color-text); text-decoration: none; transition: color var(--transition); }
.widget-list li a:hover { color: var(--color-primary-dark); }
.widget-list li:last-child a { border-bottom: none; }
.widget-list li.active a { color: var(--color-primary-dark); font-weight: 600; }
.widget-count { font-size: .8rem; color: var(--color-text-muted); font-weight: 400; }
.widget-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.widget-list--posts li a { display: flex; gap: .75rem; align-items: center; padding: .75rem 0; }
.widget-post-thumb { flex-shrink: 0; width: 60px; height: 45px; overflow: hidden; }
.widget-post-thumb img { width: 100%; height: 100%; object-fit: cover; }
.widget-post-info { flex: 1; min-width: 0; }
.widget-post-title { display: block; font-size: .85rem; font-weight: 600; color: var(--color-dark); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.widget-post-date { display: block; font-size: .7rem; color: var(--color-text-muted); margin-top: .2rem; text-transform: uppercase; letter-spacing: .04em; }
/* Blog Contact Section (end of single post) */
.blog-contact-section { margin-top: 3rem; padding-top: 3rem; border-top: var(--line); }
.blog-contact-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; padding: 2.5rem; background: var(--color-bg-light); border-radius: var(--radius-lg); }
.blog-contact-info .section-label { margin-bottom: .5rem; }
.blog-contact-info .section-title { font-size: 1.5rem; margin-bottom: .75rem; }
.blog-contact-info p { color: var(--color-text-light); font-size: .95rem; line-height: 1.7; }
@media (max-width: 768px) { .blog-contact-wrapper { grid-template-columns: 1fr; gap: 2rem; padding: 1.5rem; } .blog-contact-info .section-title { font-size: 1.25rem; } }
@media (max-width: 480px) { .blog-contact-wrapper { padding: 1.25rem 1rem; gap: 1.5rem; } .blog-contact-form { overflow: hidden; } }
/* ── Blog Featured Grid (Front Page) ── */
.blog-featured-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.blog-card { border-radius: var(--radius-lg); overflow: hidden; transition: transform .2s, box-shadow .2s; background: #fff; box-shadow: var(--shadow); border: 1px solid var(--color-border); }
.blog-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: transparent; }
.blog-card--featured { grid-row: 1 / 3; }
.blog-card-link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.blog-card--featured .blog-card-link { }
.blog-card-image { position: relative; overflow: hidden; aspect-ratio: 16/10; }
.blog-card--featured .blog-card-image { aspect-ratio: auto; flex: 1; min-height: 280px; }
.blog-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.blog-card:hover .blog-card-image img { transform: scale(1.04); }
.blog-card-image-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--color-bg-light); color: #ccc; }
.blog-card-category { position: absolute; top: .75rem; left: .75rem; background: var(--color-primary); color: var(--color-dark); font-size: .65rem; font-weight: 600; padding: .25rem .6rem; text-transform: uppercase; letter-spacing: .06em; border-radius: var(--radius-sm); }
.blog-card-body { padding: 1.25rem 1.5rem 1.5rem; display: flex; flex-direction: column; }
.blog-card--featured .blog-card-body { padding: 1.5rem 2rem 2rem; }
.blog-card-meta { display: flex; align-items: center; gap: .5rem; font-size: .72rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .75rem; }
.blog-card-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--color-text-muted); }
.blog-card-title { font-family: var(--font-heading); font-size: 1.05rem; font-weight: 600; line-height: 1.35; margin-bottom: .5rem; }
.blog-card--featured .blog-card-title { font-size: 1.35rem; }
.blog-card-excerpt { font-size: .85rem; line-height: 1.6; color: var(--color-text-light); margin-bottom: auto; }
.blog-card-readmore { display: inline-flex; align-items: center; gap: .35rem; font-size: .78rem; font-weight: 600; color: var(--color-primary); margin-top: 1rem; text-transform: uppercase; letter-spacing: .04em; }
.blog-card-readmore span { transition: transform .2s; }
.blog-card:hover .blog-card-readmore span { transform: translateX(3px); }
@media (max-width: 768px) {
.blog-featured-grid { grid-template-columns: 1fr; }
.blog-card--featured { grid-row: auto; }
.blog-card--featured .blog-card-image { min-height: 200px; }
.blog-card--featured .blog-card-title { font-size: 1.15rem; }
.blog-card--featured .blog-card-body { padding: 1.25rem 1.5rem; }
}
/* ── Archive Header ── */
.archive-header { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: var(--line); }
.archive-title { margin-bottom: .5rem; }
.archive-subtitle { color: var(--color-text-light); font-size: .95rem; }
.archive-description { margin-top: 1rem; font-size: .9rem; line-height: 1.7; color: var(--color-text); }
.location-description { margin-top: 1rem; padding: 1.25rem; background: var(--color-bg-light); border-left: 3px solid var(--color-primary); border-radius: var(--radius); font-size: .9rem; line-height: 1.7; }
/* ── 404 ── */
.error-404 { padding: 5rem 0; }
.error-404-title { font-size: 8rem; color: var(--color-primary); line-height: 1; margin-bottom: .5rem; letter-spacing: -.05em; }
.error-404 h2 { margin-bottom: .75rem; }
.error-404 p { color: var(--color-text-light); margin-bottom: 2rem; }
.error-404-actions { display: flex; gap: 1rem; justify-content: center; }
/* ── No Results / Error State ── */
.no-results { grid-column: 1 / -1; text-align: center; padding: 4rem; border-radius: var(--radius-lg); background: var(--color-bg-light); }
.no-results h2 { margin-bottom: .5rem; }
.no-results p { color: var(--color-text-light); margin-bottom: 1.5rem; }
.ddre-empty-state { padding: 4rem 0; text-align: center; }
.ddre-empty-state h1 { margin-bottom: .75rem; }
.ddre-empty-state p { color: var(--color-text-light); margin-bottom: 2rem; }
/* ═══════════════════════════════════════════
FOOTER — Structured, Line-based
═══════════════════════════════════════════ */
.site-footer { background: var(--color-dark); color: rgba(255,255,255,.7); }
.footer-main { padding: 5rem 0 3rem; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.25fr; gap: 2.5rem; }
.footer-col { padding: 0; }
.footer-col:first-child { }
.footer-col:last-child { }
@media (max-width: 1024px) { .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; } }
@media (max-width: 640px) { .footer-grid { grid-template-columns: 1fr; text-align: center; }
.footer-col { align-items: center; }
.footer-links { padding: 0; list-style: none; }
.footer-social { justify-content: center; }
.footer-company-data { text-align: center; }
.footer-office { text-align: center; }
}
@media (max-width: 768px) {
.footer-main { padding: 3rem 0 2rem; }
.footer-bottom-row { flex-direction: column; text-align: center; gap: .75rem; }
.footer-bottom-copy { text-align: center; }
.footer-bottom-credit { text-align: center; }
.footer-bottom-menu { justify-content: center; }
}
.footer-logo img { max-height: 40px; width: auto; height: auto; margin-bottom: 1rem; }
.footer-brand { color: #fff; font-size: 1.3rem; margin-bottom: .5rem; }
.footer-tagline { font-size: .85rem; margin-bottom: .75rem; color: rgba(255,255,255,.5); }
.footer-company-data { font-size: .8rem; color: rgba(255,255,255,.5); margin-bottom: 1.25rem; }
.footer-company-data p { margin-bottom: .2rem; }
.footer-company-data a { color: rgba(255,255,255,.7); text-decoration: none; }
.footer-company-data a:hover { color: var(--color-primary); }
.footer-social { display: flex; gap: 1rem; margin-top: .75rem; }
.footer-social a { color: #fff; transition: color var(--transition); }
.footer-social a svg { width: 28px; height: 28px; }
.footer-social a:hover { color: var(--color-primary); }
.footer-heading { color: var(--color-primary); font-family: var(--font-body); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .15em; margin-bottom: 1.25rem; }
.footer-links li { margin-bottom: .35rem; }
.footer-links a { color: rgba(255,255,255,.55); font-size: .85rem; transition: color var(--transition); }
.footer-links a:hover { color: var(--color-primary); }
.footer-links .count { color: rgba(255,255,255,.25); font-size: .75rem; }
.footer-office { margin-bottom: 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(255,255,255,.06); }
.footer-office:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
.footer-office strong { color: #fff; font-size: .85rem; display: block; margin-bottom: .25rem; }
.footer-office p { font-size: .8rem; margin-bottom: .2rem; color: rgba(255,255,255,.4); }
.footer-office a { color: var(--color-primary); font-size: .85rem; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.06); padding: 1.25rem 0; }
.footer-bottom-row { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.footer-bottom-nav { flex-shrink: 0; }
.footer-bottom-copy { font-size: .75rem; color: rgba(255,255,255,.3); text-align: center; flex: 1; }
.footer-bottom-credit { font-size: .75rem; color: rgba(255,255,255,.3); flex-shrink: 0; text-align: right; }
.footer-bottom-credit a { color: var(--color-primary); text-decoration: none; font-weight: 600; }
.footer-bottom-credit a:hover { color: #fff; }
.footer-bottom-menu { display: flex; gap: 1.5rem; }
.footer-bottom-menu li a { color: rgba(255,255,255,.3); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; }
.footer-bottom-menu li a:hover { color: rgba(255,255,255,.6); }
/* ── Page Content ── */
.page-content { max-width: 900px; }
.page-title { margin-bottom: 2rem; }
.privacy-back { margin-top: 3rem; padding-top: 2rem; border-top: var(--line); }
/* ── Widget ── */
.widget { margin-bottom: 1.5rem; }
.widget-title { font-family: var(--font-body); font-size: .9rem; font-weight: 700; margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: var(--line-gold); text-transform: uppercase; letter-spacing: .04em; }
/* ── Utility ── */
.gold-line { display: block; width: 50px; height: 2px; background: var(--color-primary); }
.gold-line--center { margin-left: auto; margin-right: auto; }
.divider { border: none; border-top: var(--line); margin: 3rem 0; }
.divider--gold { border-top: var(--line-gold); }
/* ═══════════════════════════════════════════
HEADER — Scroll State
═══════════════════════════════════════════ */
.site-header.scrolled { padding: .25rem 2rem; }
.site-header.scrolled .header-top { max-height: 0; opacity: 0; overflow: hidden; }
.site-header.scrolled .header-main { border-radius: var(--radius-xl); box-shadow: 0 4px 20px rgba(0,0,0,.06); }
/* ── WordPress Admin Bar offset ── */
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }
/* ═══════════════════════════════════════════
CONTACT PAGE (Asari)
═══════════════════════════════════════════ */
.contact-section { padding: 3rem 0; }
.contact-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.contact-info { padding: 2.5rem; border-right: var(--line); }
.contact-info h2 { font-size: 1.3rem; margin-bottom: 1.5rem; padding-bottom: .75rem; border-bottom: var(--line); }
.contact-form-wrap { padding: 2.5rem; }
.contact-form-wrap h2 { font-size: 1.3rem; margin-bottom: 1.5rem; padding-bottom: .75rem; border-bottom: var(--line); }
.contact-detail { display: flex; align-items: center; gap: .75rem; margin-bottom: .75rem; font-size: .9rem; color: var(--color-text-light); }
.contact-detail a { color: var(--color-primary-dark); font-weight: 500; }
.contact-detail svg { flex-shrink: 0; color: var(--color-text-muted); }
.contact-legal { font-size: .8rem; color: var(--color-text-muted); margin-top: .25rem; }
@media (max-width: 1024px) {
.contact-layout { grid-template-columns: 1fr; }
.contact-info { border-right: none; border-bottom: var(--line); }
}
@media (max-width: 768px) {
.contact-info, .contact-form-wrap { padding: 2rem 1.5rem; }
.contact-info h2, .contact-form-wrap h2 { font-size: 1.1rem; }
}
@media (max-width: 480px) {
.contact-info, .contact-form-wrap { padding: 1.5rem 1rem; }
}
/* ═══════════════════════════════════════════
AGENT DETAIL PAGE (Asari)
═══════════════════════════════════════════ */
.agent-detail-section { padding: 3rem 0; }
.agent-detail-layout { display: grid; grid-template-columns: 320px 1fr; gap: 3rem; }
.agent-detail-card { text-align: center; padding: 2.5rem; border-radius: var(--radius-lg); box-shadow: var(--shadow); align-self: start; position: sticky; top: 100px; background: #fff; }
.agent-detail-photo { width: 220px; height: 290px; overflow: hidden; margin: 0 auto 1.5rem; border: 3px solid var(--color-primary); border-radius: var(--radius); }
.agent-detail-photo img { width: 100%; height: 100%; object-fit: cover; }
.agent-detail-name { font-size: 1.4rem; margin-bottom: .25rem; }
.agent-detail-license { font-size: .8rem; color: var(--color-text-muted); margin-bottom: 1.5rem; padding-bottom: 1.25rem; border-bottom: var(--line); }
.agent-detail-contact { display: flex; flex-direction: column; gap: .5rem; }
.agent-detail-description { font-size: .9rem; color: var(--color-text-light); line-height: 1.7; margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: var(--line); }
.agent-detail-listings h2 { font-size: 1.3rem; margin-bottom: 1.5rem; padding-bottom: .75rem; border-bottom: var(--line); }
@media (max-width: 1024px) {
.agent-detail-layout { grid-template-columns: 1fr; gap: 2rem; }
.agent-detail-card { position: static; max-width: 400px; margin: 0 auto; }
}
@media (max-width: 480px) {
.agent-detail-section { padding: 1.5rem 0; }
.agent-detail-card { max-width: 100%; padding: 1.5rem; }
.agent-detail-photo { width: 160px; height: 210px; }
.agent-detail-name { font-size: 1.2rem; }
}
/* ═══════════════════════════════════════════
OFFERS ARCHIVE (Asari)
═══════════════════════════════════════════ */
.property-archive-section { padding: 3rem 0; }
.asari-offers-wrapper { margin-top: 1.5rem; transition: opacity .3s ease; min-height: 200px; }
.asari-map-wrapper { margin-bottom: 1.5rem; }
/* ═══════════════════════════════════════════
ASARIPLUG SHORTCODE OVERRIDES
Styles for [asariplug-offers], [asariplug-team],
[asariplug-contact-form], search, map — adapted
to our premium gold+dark design.
═══════════════════════════════════════════ */
/* ── Offers Grid: .widget-offers ── */
.widget-offers { font-family: var(--font-body); }
.widget-offers .holder { display: grid; gap: 1.5rem; }
.widget-offers.boxes .holder { grid-template-columns: repeat(3, 1fr); }
.widget-offers.boxes.cols-2 .holder { grid-template-columns: repeat(2, 1fr); }
.widget-offers.boxes.cols-1 .holder { grid-template-columns: 1fr; }
.widget-offers.rows .holder { grid-template-columns: 1fr; }
@media (max-width: 1024px) { .widget-offers.boxes .holder { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .widget-offers.boxes .holder, .widget-offers.boxes.cols-2 .holder { grid-template-columns: 1fr; } }
/* ── Offer Card: .property ── */
.widget-offers .property { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); border: 1px solid var(--color-border); overflow: hidden; transition: all .3s ease; position: relative; cursor: pointer; }
.widget-offers .property:hover { box-shadow: var(--shadow-hover); }
.widget-offers .property .name a::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.widget-offers .property .inner { display: flex; flex-direction: column; height: 100%; }
.widget-offers.rows .property .inner { flex-direction: row; }
/* Offer card image — placeholder for missing/broken photos */
.widget-offers .property .image { position: relative; aspect-ratio: 3/2; overflow: hidden; background: #f0f0f0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24' fill='none' stroke='%23ccc' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'%3E%3C/circle%3E%3Cpolyline points='21 15 16 10 5 21'%3E%3C/polylyline%3E%3C/svg%3E") no-repeat center center; flex-shrink: 0; }
.widget-offers .property .image img[src=""],
.widget-offers .property .image img:not([src]) { display: none; }
/* Offer card slider — arrows + counter */
.dd-slider-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 4; width: 28px; height: 28px; border: none; border-radius: 50%; background: rgba(0,0,0,.45); color: #fff; font-size: 18px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .2s; }
.widget-offers .property:hover .dd-slider-arrow { opacity: 1; }
.dd-slider-prev { left: 6px; }
.dd-slider-next { right: 6px; }
.dd-slider-arrow:hover { background: rgba(0,0,0,.7); }
.dd-slider-counter { position: absolute; bottom: 6px; right: 6px; z-index: 4; background: rgba(0,0,0,.5); color: #fff; font-size: .7rem; font-weight: 600; padding: 2px 6px; border-radius: 3px; }
/* Mobile: always show arrows */
@media (max-width: 768px) {
.dd-slider-arrow { opacity: 1; width: 32px; height: 32px; font-size: 20px; }
}
/* Empty state when no offers match filters */
/* Form success/error messages */
.ddre-form-message { display: flex; align-items: center; gap: .75rem; padding: 1.25rem 1.5rem; border-radius: 8px; margin-bottom: 1.5rem; animation: fadeUp .3s ease; }
.ddre-form-success { background: #f0fdf4; border: 1px solid #bbf7d0; }
.ddre-form-success p { color: #166534; font-weight: 500; margin: 0; }
.ddre-form-error { background: #fef2f2; border: 1px solid #fecaca; }
.ddre-form-error p { color: #991b1b; font-weight: 500; margin: 0; }
.offers-empty-state { text-align: center; padding: 4rem 2rem; }
.offers-empty-state svg { margin-bottom: 1.5rem; opacity: .5; }
.offers-empty-state h2 { font-size: 1.5rem; font-weight: 700; color: var(--color-dark); margin-bottom: .75rem; }
.offers-empty-state p { font-size: 1rem; color: var(--color-muted); max-width: 480px; margin: 0 auto 1.5rem; line-height: 1.6; }
.offers-empty-state .btn { font-size: .95rem; }
.widget-offers.rows .property .image { width: 320px; aspect-ratio: auto; min-height: 200px; }
.widget-offers .property .image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.widget-offers .property:hover .image img { transform: scale(1.03); }
.widget-offers .property .image a { display: block; width: 100%; height: 100%; }
/* Offer Card Info */
.widget-offers .property .info { padding: 1.25rem 1.25rem 1.5rem; display: flex; flex-direction: column; flex: 1; gap: 0; }
.widget-offers .property .info > .section { padding: 0; background: none; margin: 0; }
.widget-offers .property .location { font-size: .8rem; color: var(--color-text-light); margin-bottom: .5rem; display: flex; align-items: center; gap: .3rem; }
.widget-offers .property .name { font-family: var(--font-body); font-size: .875rem; font-weight: 500; line-height: 1.4; color: var(--color-text); margin-bottom: .75rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.widget-offers .property .name a { color: inherit; text-decoration: none; }
.widget-offers .property .name a:hover { color: var(--color-primary-dark); }
.widget-offers .property .desc { font-size: .85rem; color: var(--color-text-light); line-height: 1.6; margin-bottom: .75rem; }
/* Offer Card Prices */
.widget-offers .property .prices { margin-bottom: .75rem; padding-bottom: .75rem; border-bottom: var(--line); }
.widget-offers .property .price { font-size: 1.2rem; font-weight: 700; color: var(--color-dark); }
.widget-offers .property .price-m2 { font-size: .8rem; color: var(--color-text-light); margin-top: .15rem; }
/* Offer Card Params */
.widget-offers .property .params { margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-template-rows: auto auto; gap: 0 1.25rem; font-size: .8rem; color: var(--color-text-muted); padding-top: .75rem; border-top: var(--line); margin-top: auto; }
.widget-offers .property .params dt { display: block; font-size: .65rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); opacity: .7; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
.widget-offers .property .params dd { margin: 0; font-size: .9rem; font-weight: 700; color: var(--color-dark); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Offer Card Links */
.widget-offers .property .links { display: flex; gap: .5rem; margin-top: .75rem; padding-top: .75rem; border-top: var(--line); position: relative; z-index: 2; }
.widget-offers .property .link-offer,
.widget-offers .property .links .btn { display: inline-flex; align-items: center; justify-content: center; padding: .5rem 1.25rem; font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; text-decoration: none; border: 2px solid transparent; border-radius: var(--radius-pill); transition: all var(--transition); cursor: pointer; }
.widget-offers .property .links .btn-primary,
.widget-offers .property .link-offer { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
.widget-offers .property .links .btn-primary:hover,
.widget-offers .property .link-offer:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); }
/* Bookmark button — hidden, not used in this theme */
.widget-offers .property .bookmark { display: none !important; }
/* ── Offers Pagination ── */
.widget-offers .pagination,
.widget-team .pagination { display: flex; justify-content: center; list-style: none; padding: 0; margin: 2rem 0 0; gap: .5rem; }
.widget-offers .pagination li,
.widget-team .pagination li { margin: 0; }
.widget-offers .pagination a,
.widget-team .pagination a { display: flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 .5rem; font-size: .9rem; border: var(--line); background: #fff; color: var(--color-text); transition: all var(--transition); text-decoration: none; border-radius: var(--radius-sm); }
.widget-offers .pagination a:hover,
.widget-team .pagination a:hover { background: var(--color-primary-light); border-color: var(--color-primary); }
.widget-offers .pagination a.active,
.widget-team .pagination a.active { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-dark); font-weight: 700; }
/* ── Team: .widget-team ── */
.widget-team { font-family: var(--font-body); margin-bottom: 2.5rem; }
.widget-team > h2 { font-size: 1.3rem; font-weight: 700; margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: var(--line); color: var(--color-dark); }
.widget-team .holder { display: grid; gap: var(--grid-gap); }
.widget-team.boxes .holder { grid-template-columns: repeat(3, 1fr); }
.widget-team.boxes.cols-4 .holder { grid-template-columns: repeat(4, 1fr); }
.widget-team.boxes.cols-2 .holder { grid-template-columns: repeat(2, 1fr); }
.widget-team.rows .holder { grid-template-columns: 1fr; }
@media (max-width: 1024px) { .widget-team.boxes .holder, .widget-team.boxes.cols-4 .holder { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .widget-team.boxes .holder, .widget-team.boxes.cols-2 .holder { grid-template-columns: 1fr; } }
.widget-team .person { text-align: center; padding: 2rem 1.5rem; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); transition: all var(--transition); }
.widget-team .person:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
.widget-team .person .inner { display: flex; flex-direction: column; align-items: center; height: 100%; }
.widget-team .person .info { width: 100%; }
.widget-team .person .info > .section { padding: 0; background: none; margin: 0; }
.widget-team .person .image { width: 150px; height: 195px; margin: 0 auto 1.25rem; overflow: hidden; border: 3px solid var(--color-primary); border-radius: var(--radius); }
.widget-team .person .image img { width: 100%; height: 100%; object-fit: cover; }
.widget-team .person .name { font-weight: 700; font-size: .95rem; margin-bottom: .15rem; }
.widget-team .person .name a { color: inherit; text-decoration: none; }
.widget-team .person .position { font-size: .8rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .05em; }
.widget-team .person .licence { font-size: .7rem; color: var(--color-text-muted); margin-bottom: .5rem; }
.widget-team .person .desc { font-size: .85rem; color: var(--color-text-light); line-height: 1.6; margin-bottom: .75rem; }
.widget-team .person ul.links { list-style: none; padding: 0; margin: .5rem 0; }
.widget-team .person ul.links li { margin-bottom: .25rem; }
.widget-team .person ul.links a { font-size: .85rem; color: var(--color-primary-dark); font-weight: 500; }
.widget-team .person .links .btn { display: inline-flex; align-items: center; padding: .4rem 1rem; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; text-decoration: none; border: 2px solid transparent; border-radius: var(--radius-pill); transition: all var(--transition); margin: .25rem .15rem; }
.widget-team .person .link-contact { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
.widget-team .person .link-contact:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); }
.widget-team .person .link-offers { background: transparent; color: var(--color-dark); border-color: var(--color-dark); }
.widget-team .person .link-offers:hover { background: var(--color-dark); color: #fff; }
/* ── Contact Form: .widget-contact-form ── */
.widget-contact-form { font-family: var(--font-body); }
.widget-contact-form .form { max-width: 100%; }
.widget-contact-form .form-group { margin-bottom: .75rem; }
.widget-contact-form .form-group label { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin-bottom: .35rem; }
.widget-contact-form .form-control { width: 100%; max-width: 100%; padding: .75rem 1rem; border: var(--line); font-size: .9rem; font-family: var(--font-body); transition: all var(--transition); background: #fff; border-radius: var(--radius-sm); }
.widget-contact-form .form-control:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255,216,0,.15); }
.widget-contact-form .form-control.error { border-color: var(--color-danger); }
.widget-contact-form textarea.form-control { resize: vertical; min-height: 100px; }
.widget-contact-form .form-group.clausule { font-size: .75rem; color: var(--color-text-muted); }
.widget-contact-form .form-group.clausule label { display: flex; gap: .5rem; align-items: flex-start; cursor: pointer; text-transform: none; letter-spacing: 0; font-weight: 400; }
.widget-contact-form .form-group.clausule input { margin-top: 3px; flex-shrink: 0; }
.widget-contact-form .form-group.submit { margin-top: 1rem; }
.widget-contact-form .form-group.submit .btn,
.widget-contact-form .form-group.submit button { display: inline-flex; align-items: center; justify-content: center; padding: .85rem 2rem; font-weight: 600; font-size: .875rem; border: 2px solid transparent; border-radius: var(--radius-pill); transition: all var(--transition); cursor: pointer; letter-spacing: .02em; text-transform: uppercase; font-family: var(--font-body); background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); width: 100%; }
.widget-contact-form .form-group.submit .btn:hover,
.widget-contact-form .form-group.submit button:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); }
.widget-contact-form .form-message { padding: 1rem; margin-top: 1rem; font-size: .9rem; border: var(--line); background: var(--color-bg-light); border-radius: var(--radius-sm); }
.widget-contact-form .form { overflow: hidden; }
/* ══ Custom Search Engine (.dd-sengine) ══ */
.dd-sengine { background: #fff; padding: 1.5rem 1.75rem 1rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); font-family: var(--font-body); }
.dd-se-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .75rem 1rem; margin-bottom: .85rem; align-items: end; }
.dd-se-row--actions { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin-bottom: .5rem; }
.dd-se-field label { display: block; font-size: .72rem; font-weight: 600; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .4rem; }
.dd-se-input, .dd-se-select { width: 100%; padding: .7rem 1rem; border: 1px solid #ddd; border-radius: var(--radius); font-size: .92rem; font-family: var(--font-body); background: #fafafa; height: 46px; box-sizing: border-box; transition: border-color .2s, box-shadow .2s; -webkit-appearance: none; }
.dd-se-select { background: #fafafa url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .85rem center; padding-right: 2.5rem; cursor: pointer; }
.dd-se-input:focus, .dd-se-select:focus { outline: none; border-color: var(--color-primary); background: #fff; box-shadow: 0 0 0 3px rgba(212,175,55,.15); }
.dd-se-input::placeholder { color: #aaa; }
.dd-se-field--loc { flex: 2; min-width: 200px; position: relative; }
.dd-se-field--radius-map { flex: 0 0 220px; min-width: 180px; }
.dd-se-radius-map-row { display: flex; gap: .5rem; }
.dd-se-radius-half { flex: 1; }
.dd-se-map-half { flex: 1; }
.dd-se-map-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; width: 100%; padding: .7rem .75rem; border: 1px solid #ddd; border-radius: var(--radius); background: #fafafa; cursor: pointer; font-size: .85rem; font-weight: 600; font-family: var(--font-body); color: var(--color-dark); height: 46px; box-sizing: border-box; transition: all .2s; }
.dd-se-map-btn:hover { border-color: var(--color-primary); background: rgba(255,215,0,.08); color: var(--color-primary); }
.dd-se-field--loc .asariplug_sengine_locAuto_input { width: 100%; padding: .7rem 1rem; border: 1px solid #ddd; border-radius: var(--radius); font-size: .92rem; font-family: var(--font-body); background: #fafafa; height: 46px; box-sizing: border-box; }
.dd-se-field--loc .asariplug_sengine_locaAuto_proposed { position: absolute; left: 0; right: 0; top: 100%; z-index: 20; }
/* Own autocomplete dropdown for offers page */
.offers-ac-dropdown {
display: none; position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 200;
background: #fff; border: 1px solid #e0e0e0; border-radius: 0 0 8px 8px;
box-shadow: 0 8px 24px rgba(0,0,0,.12); max-height: 320px; overflow-y: auto;
animation: acSlideDown .2s ease-out;
}
.offers-ac-dropdown div { padding: .65rem 1rem; font-size: .92rem; color: #1a1a1a; font-weight: 500; cursor: pointer; border-bottom: 1px solid #f3f3f3; line-height: 1.35; transition: background .15s; }
.offers-ac-dropdown div:last-child { border-bottom: none; }
.offers-ac-dropdown div:hover { background: #fffde6; }
/* !important nadpisuje inline style z backendu autoloc
(Asari zwraca Podlaskie)
— bez tego wyglądałoby jak zwykły szary tekst, nie złoty uppercase jak w hero. */
.offers-ac-dropdown div span { display: block !important; font-size: .68rem !important; font-weight: 700 !important; color: #b8960c !important; text-transform: uppercase !important; letter-spacing: .06em !important; margin-bottom: .15rem !important; opacity: 1 !important; }
.offers-ac-dropdown div em { color: #666; font-style: normal; font-weight: 400; font-size: .82rem; margin-left: .35rem; }
/* Przycisk-wypełnienie WEWNĄTRZ pola input — zajmuje prawy koniec inputa
od góry do dołu, pionowa kreska oddziela go od reszty pola.
Kolory Dobry Dom, prostokątne, invert między stanami. */
.dd-loc-input-wrap { position: relative; }
.dd-loc-toggle {
display: none; position: absolute; right: 0; top: 0; bottom: 0;
padding: 0 .9rem; margin: 0;
border: none; border-left: 1px solid #1a2332;
background: #ffd800; color: #1a2332;
font-size: .78rem; cursor: pointer;
text-transform: none; letter-spacing: normal; font-weight: 600;
white-space: nowrap; line-height: 1; z-index: 5;
text-decoration: none;
/* Prawe rogi zaokrąglone żeby pasowały do inputa; lewe kanciaste
bo tam jest pionowa kreska dzieląca. Wartość matchuje --radius
inputa .dd-se-input; hero (.search-input) ma --radius-sm — nadpis niżej. */
border-radius: 0 var(--radius) var(--radius) 0;
transition: background .15s, color .15s;
}
.dd-loc-toggle:hover { background: #1a2332; color: #ffd800; }
.dd-loc-toggle.is-visible { display: inline-flex; align-items: center; }
.dd-loc-toggle.is-exact { background: #1a2332; color: #ffd800; border-left-color: #ffd800; }
.dd-loc-toggle.is-exact:hover { background: #ffd800; color: #1a2332; border-left-color: #1a2332; }
/* Hero (property-search--hero) używa --radius-sm dla inputów */
.property-search--hero .dd-loc-toggle { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
/* input dostaje miejsce po prawej gdy button jest widoczny */
.dd-loc-input-wrap:has(.dd-loc-toggle.is-visible) input {
padding-right: 155px !important;
}
.offers-ac-dropdown p { padding: .65rem 1rem; font-size: .85rem; color: #999; text-align: center; margin: 0; }
.dd-se-field--loc .f_location_locality_mapSelected { display: none; }
.property-search .asariplug_sengine_locAuto_input { width: 100%; }
.property-search .asariplug_sengine_locaAuto { position: relative; }
.property-search .f_location_locality_mapTrigger { display: none; }
.property-search .f_location_locality_mapSelected { display: none; }
.dd-se-field--street { flex: 1; }
.dd-se-submit { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 2.5rem; font-weight: 700; font-size: .95rem; text-transform: uppercase; letter-spacing: .04em; border: 2px solid var(--color-primary); border-radius: var(--radius-pill); cursor: pointer; background: var(--color-primary); color: var(--color-dark); font-family: var(--font-body); height: 48px; transition: all .2s; }
.dd-se-submit:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.dd-se-reset { display: inline-flex; align-items: center; gap: .35rem; padding: .65rem 1.25rem; font-size: .85rem; font-weight: 600; color: #666; text-decoration: none; border: 1px solid #ddd; border-radius: var(--radius-pill); background: #fff; font-family: var(--font-body); transition: all .2s; }
.dd-se-reset:hover { color: #c00; border-color: #c00; background: #fff5f5; }
.dd-se-advanced-btn { display: inline-flex; align-items: center; gap: .4rem; padding: .65rem 1.25rem; font-size: .85rem; font-weight: 600; border: 1px solid #ddd; border-radius: var(--radius-pill); background: #fafafa; cursor: pointer; color: var(--color-text); font-family: var(--font-body); transition: all .2s; }
.dd-se-advanced-btn:hover { border-color: var(--color-primary); background: rgba(255,215,0,.06); }
.dd-se-advanced-btn.is-open { border-color: var(--color-primary); background: rgba(255,215,0,.1); }
.dd-se-advanced-btn.is-open svg { transform: rotate(180deg); }
.dd-se-advanced-btn svg { transition: transform .2s; }
.dd-se-advanced { border-top: 1px solid #eee; margin-top: .5rem; padding-top: .85rem; animation: fadeUp .25s ease; }
@media (max-width: 768px) {
.dd-sengine { padding: 1.25rem 1rem .75rem; }
.dd-se-row { grid-template-columns: 1fr 1fr; }
.dd-se-field--loc { flex: 1 1 100%; }
.dd-se-input, .dd-se-select { font-size: 16px; }
}
@media (max-width: 480px) {
.dd-se-row { grid-template-columns: 1fr; }
.dd-se-row--actions { flex-direction: column; }
.dd-se-submit { width: 100%; justify-content: center; }
}
/* Bootstrap row/col overrides within contact form */
.widget-contact-form .row { display: flex; flex-wrap: wrap; margin: 0 -.5rem; }
.widget-contact-form .col { padding: 0 .5rem; flex: 1; min-width: 0; }
@media (max-width: 640px) { .widget-contact-form .col { flex: 0 0 100%; } }
/* ── Search Engine: .asariplug_sengine ── */
.asariplug_sengine { font-family: var(--font-body); background: #fff; padding: 1rem 1.5rem 0.5rem; margin-bottom: 2rem; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }
.asariplug_sengine label { font-size: .75rem; font-weight: 600; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .5rem; display: block; }
.asariplug_sengine select,
.asariplug_sengine input[type="text"],
.asariplug_sengine input[type="number"] { width: 100%; padding: .75rem 1rem; border: 1px solid #ddd; border-radius: var(--radius); font-size: .95rem; font-family: var(--font-body); background: #fafafa; transition: all var(--transition); -webkit-appearance: none; height: 48px; box-sizing: border-box; }
.asariplug_sengine select { background: #fafafa url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .85rem center; padding-right: 2.5rem; cursor: pointer; }
.asariplug_sengine select:focus,
.asariplug_sengine input:focus { outline: none; border-color: var(--color-primary); background: #fff; box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb, 212,175,55), .15); }
.asariplug_sengine input::placeholder { color: #aaa; font-size: .9rem; }
.asariplug_sengine input[type="submit"],
.asariplug_sengine .btn,
.asariplug_sengine button[type="submit"] { display: inline-flex; align-items: center; justify-content: center; padding: .85rem 2.5rem; font-weight: 700; font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; border: 2px solid var(--color-primary); border-radius: var(--radius-pill); cursor: pointer; transition: all var(--transition); font-family: var(--font-body); background: var(--color-primary); color: var(--color-dark); height: 48px; box-sizing: border-box; }
.asariplug_sengine input[type="submit"]:hover,
.asariplug_sengine .btn:hover,
.asariplug_sengine button[type="submit"]:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.15); }
.asariplug_sengine .btn-default { background: #fff; color: var(--color-text); border-color: #ddd; }
.asariplug_sengine .btn-default:hover { background: var(--color-primary-light); border-color: var(--color-primary); transform: none; box-shadow: none; }
.asariplug_sengine input[type="button"] { font-family: var(--font-body); font-size: .85rem; font-weight: 600; padding: .6rem 1.25rem; border: 1px solid #ddd; border-radius: var(--radius-pill); background: #fafafa; cursor: pointer; transition: all var(--transition); color: var(--color-text); }
.asariplug_sengine input[type="button"]:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
/* Search engine rows & layout — !important needed to override plugin inline styles */
.asariplug_sengine_rowElast { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 1.25rem 1rem; margin-bottom: 2.5rem; align-items: end; }
.asariplug_sengine_colSpan_1 { width: auto !important; float: none !important; min-width: 0; }
.asariplug_sengine_rowConf { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)) !important; gap: .5rem; margin-bottom: 0; align-items: end; float: none !important; width: auto !important; }
.asariplug_sengine_rowConf_colNum_2 { grid-template-columns: 1fr 1fr !important; }
.asariplug_sengine_rowConf_colNum_3 { grid-template-columns: 1fr 1fr 1fr !important; }
.asariplug_sengine_rowConf .asariplug_sengine_colSpan_1 { width: auto !important; float: none !important; }
.asariplug_common_box { position: relative; }
.asariplug_sengine_minmax { display: flex; gap: .5rem; align-items: center; }
.asariplug_sengine_minmax input { flex: 1; min-width: 0; }
.asariplug_sengine .cl { display: none; height: 0; margin: 0; padding: 0; font-size: 0; line-height: 0; overflow: hidden; }
.asariplug_sengine_hideSection_hide { display: none !important; }
.asariplug_sengine_advancedblock { display: none; }
.asariplug_sengine_hideSectionAdvanced_show .asariplug_sengine_advancedblock { display: block; }
/* Price slider — span full row width */
.asariplug_sengine .asariplug_sengine_hideSection:has(.asariplug_sengine_dictionarySliderRange_container) { grid-column: 1 / -1; }
/* Location field map trigger */
.f_location_locality_mapTrigger { display: none !important; }
.asariplug_sengine_locAuto_input { padding-right: 3rem !important; }
/* Map selected area badge — compact pill style */
.f_location_locality_mapSelected { display: none; align-items: center; padding: .35rem .75rem; background: #faf6e8; border: 1px solid #e8dfc0; border-radius: 6px; font-size: .78rem; margin-top: .3rem; z-index: 2; }
.f_location_locality_mapSelected a { font-size: .78rem; color: #8a7520; text-decoration: none; font-weight: 600; }
.f_location_locality_mapSelected a:hover { color: #c00; }
/* Location autocomplete dropdown — global */
.asariplug_sengine_locaAuto_proposed { position: absolute; left: 0; right: 0; background: #fff; border: 1px solid #e0e0e0; border-top: none; border-radius: 0 0 8px 8px; box-shadow: 0 8px 24px rgba(0,0,0,.12); z-index: 100; max-height: 320px; overflow-y: auto; }
.asariplug_sengine_locaAuto_proposed div { padding: .65rem 1rem; font-size: .92rem; color: #1a1a1a; font-weight: 500; cursor: pointer; transition: background .15s; border-bottom: 1px solid #f3f3f3; line-height: 1.35; }
.asariplug_sengine_locaAuto_proposed div:last-child { border-bottom: none; }
.asariplug_sengine_locaAuto_proposed div:hover { background: #fffde6; }
.asariplug_sengine_locaAuto_proposed div span { display: block; font-size: .68rem; font-weight: 700; color: #b8960c; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .15rem; opacity: 1 !important; }
.asariplug_sengine_locaAuto_proposed p { padding: .65rem 1rem; font-size: .85rem; color: #999; text-align: center; margin: 0; }
/* Selected location tags */
.asariplug_sengine_locaAuto_selected { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .35rem; }
.asariplug_sengine_locaAuto_selected span { display: inline-flex; align-items: center; gap: .3rem; background: #f8f6ed; border: 1px solid #e8e0c0; border-radius: 4px; padding: .2rem .5rem; font-size: .78rem; font-weight: 500; color: #333; }
.asariplug_sengine_locaAuto_selected span a { color: #b8960c; text-decoration: none; font-weight: 700; font-size: .85em; }
.asariplug_sengine_locaAuto_selected span a:hover { color: #d00; }
/* Price slider */
.asariplug_sengine_dictionarySliderRange_container { padding: .75rem 0 .35rem; font-size: .9rem; color: var(--color-text); }
.asariplug_sengine_dictionarySliderRange_container > span:first-of-type { color: var(--color-text-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.asariplug_sengine_dictionarySliderRange_container .juisliderStart,
.asariplug_sengine_dictionarySliderRange_container .juisliderStop { font-weight: 700; color: var(--color-dark); }
.asariplug_sengine_dictionarySliderRange { margin-top: 1rem; margin-bottom: .75rem; }
.asariplug_sengine .ui-slider { height: 6px; background: #e8e8e8; border: none; border-radius: 3px; position: relative; }
.asariplug_sengine .ui-slider-range { background: var(--color-primary); border-radius: 3px; }
.asariplug_sengine .ui-slider-handle { width: 22px; height: 22px; top: -8px; margin-left: -11px; background: var(--color-primary); border: 2px solid #fff; border-radius: 50%; cursor: grab; box-shadow: 0 2px 8px rgba(0,0,0,.2); transition: transform .15s ease; outline: none; }
.asariplug_sengine .ui-slider-handle:hover,
.asariplug_sengine .ui-slider-handle:active { transform: scale(1.2); background: var(--color-primary-dark); }
.asariplug_sengine .ui-slider-handle:focus { outline: none; }
/* Submit button row — full width */
.asariplug_sengine input[type="submit"] { width: 100%; padding: .85rem 2.5rem; font-size: 1rem; margin-top: .25rem; height: 52px; border-radius: var(--radius-pill); }
/* Checkbox selects */
.asariplug_sengine_checkselect { position: relative; }
.asariplug_sengine_checkselect_label { padding: .75rem 1rem; border: 1px solid #ddd; border-radius: var(--radius); font-size: .95rem; background: #fafafa; cursor: pointer; display: block; transition: border-color var(--transition); height: 48px; box-sizing: border-box; display: flex; align-items: center; }
.asariplug_sengine_checkselect_label:hover { border-color: var(--color-primary); }
.asariplug_sengine_checkselect_boxes { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #ddd; border-top: none; border-radius: 0 0 var(--radius) var(--radius); z-index: 10; max-height: 260px; overflow-y: auto; box-shadow: var(--shadow-lg); }
.asariplug_sengine_checkselect_boxes label { display: flex; align-items: center; gap: .6rem; padding: .55rem 1rem; font-size: .9rem; cursor: pointer; text-transform: none; letter-spacing: 0; font-weight: 400; transition: background var(--transition); }
.asariplug_sengine_checkselect_boxes label:hover { background: var(--color-primary-light); }
/* Select2 overrides (multi-select location) */
.asariplug_sengine .select2-container--default .select2-selection--multiple { min-height: 48px; border: 1px solid #ddd; border-radius: var(--radius); background: #fafafa; padding: .35rem .5rem; font-size: .9rem; }
.asariplug_sengine .select2-container--default .select2-selection--multiple:focus-within { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb, 212,175,55), .15); }
.asariplug_sengine .select2-container--default .select2-selection__choice { background: var(--color-primary-light); border-color: var(--color-primary); font-size: .85rem; padding: .2rem .5rem; }
/* ── Map: .asariplug_sengine_mapsearch ── */
.asariplug_sengine_mapsearch { position: relative; margin-bottom: 1.5rem; border: var(--line); overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.asariplug_sengine_mapsearch:not([data-visible='1']) { display: none; }
.asariplug_sengine_mapsearch_gmap { width: 100%; min-height: 500px; border-bottom: var(--line); }
.asariplug_sengine_mapsearch_gmap.leaflet-container { font-family: var(--font-body); }
/* Map info bar (bottom overlay with buttons) */
.asariplug_sengine_mapsearch_info { position: absolute; bottom: 0; left: 0; width: 100%; padding: .6rem 1rem; background: rgba(255,255,255,.92); backdrop-filter: blur(6px); font-size: .9rem; border-top: var(--line); box-sizing: border-box; z-index: 500; display: flex; align-items: center; justify-content: center; gap: 1rem; }
/* Area select / cancel buttons */
.asariplug_sengine_mapsearch_mapSelect,
.asariplug_sengine_mapsearch_mapCancel { display: none; padding: .65rem 1.5rem; font-size: .85rem; font-weight: 600; font-family: var(--font-body); cursor: pointer; transition: all var(--transition); text-align: center; line-height: 1.4; white-space: nowrap; }
.asariplug_sengine_mapsearch_mapSelect { color: var(--color-dark); background: var(--color-primary); border-radius: var(--radius-pill); }
.asariplug_sengine_mapsearch_mapSelect:hover { background: var(--color-primary-dark); }
.asariplug_sengine_mapsearch_mapCancel { color: #fff; background: #e74c3c; border: none; border-radius: var(--radius-pill); }
.asariplug_sengine_mapsearch_mapCancel:hover { background: #c0392b; }
.asariplug_sengine_mapsearch_filterToggle { display: inline-flex; align-items: center; gap: .35rem; padding: .65rem 1.5rem; font-size: .85rem; font-weight: 600; font-family: var(--font-body); cursor: pointer; transition: all var(--transition); text-align: center; line-height: 1.4; white-space: nowrap; color: var(--color-dark); background: transparent; border: 1px solid var(--color-border); border-radius: var(--radius-pill); }
.asariplug_sengine_mapsearch_filterToggle:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.asariplug_sengine_mapsearch_filterToggle.is-active { background: var(--color-primary); border-color: var(--color-primary); }
.asariplug_sengine_mapsearch_filterToggle svg { vertical-align: middle; margin-right: .25rem; }
.asariplug_sengine_mapsearch_searchBtn { display: inline-flex; align-items: center; gap: .35rem; padding: .65rem 1.5rem; font-size: .85rem; font-weight: 700; font-family: var(--font-body); cursor: pointer; transition: all var(--transition); text-align: center; line-height: 1.4; white-space: nowrap; color: var(--color-dark); background: var(--color-primary); border-radius: var(--radius-pill); }
.asariplug_sengine_mapsearch_searchBtn:hover { background: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.15); }
/* "Mapa" toggle button in toolbar */
.btn-map-toggle { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem 1.25rem; font-size: .85rem; font-weight: 500; font-family: var(--font-body); background: var(--color-bg-light); border: var(--line); border-radius: var(--radius-pill); cursor: pointer; transition: all var(--transition); color: var(--color-text); }
.btn-map-toggle:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.btn-map-toggle svg { flex-shrink: 0; }
/* Archive toolbar layout */
.archive-toolbar-actions { display: flex; align-items: center; gap: .75rem; }
@media (max-width: 768px) { .asariplug_sengine_mapsearch_gmap { min-height: 350px; } }
@media (max-width: 480px) { .asariplug_sengine_mapsearch_gmap { min-height: 260px; } }
/* ── Map Infobox Popup ── */
.infobox-wrapper { font-family: var(--font-body); position: relative; }
.infobox-wrapper > img { position: absolute !important; top: 10px; right: 8px; opacity: .5; transition: opacity .2s; z-index: 2; cursor: pointer; }
.infobox-wrapper > img:hover { opacity: 1; }
.infobox-wrapper .infobox-inner { position: relative; margin-bottom: 40px; min-width: 220px; max-width: 280px; font-size: .8rem; background: #fff; border-top: 4px solid var(--color-primary); border-radius: 0 0 var(--radius) var(--radius); box-shadow: 0 4px 16px rgba(0,0,0,.2); overflow: hidden; }
.infobox-wrapper .infobox-inner::after { content: ''; position: absolute; left: 50%; bottom: -8px; margin-left: -8px; width: 0; height: 0; border-style: solid; border-width: 8px 8px 0 8px; border-color: #fff transparent transparent transparent; }
/* Infobox image area */
.infobox-wrapper .infobox-inner .infobox-image { position: relative; width: 100%; min-height: 140px; overflow: hidden; background: #eee; }
/* Loading shimmer animation while photo loads */
.infobox-wrapper .infobox-inner .infobox-image::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent); animation: imgShimmer 1.5s infinite; z-index: 0; }
@keyframes imgShimmer { to { left: 100%; } }
.infobox-wrapper .infobox-inner .infobox-image img[data-loaded="1"] + *,
.infobox-wrapper .infobox-inner .infobox-image img[src*="asariweb"] + * { } /* shimmer stops when loaded */
.infobox-wrapper .infobox-inner .infobox-image::after { content: ''; position: absolute; display: block; top: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent 45%, rgba(0,0,0,.7) 100%); pointer-events: none; z-index: 1; }
.infobox-wrapper .infobox-inner .infobox-image img { width: 100%; height: 155px; display: block; object-fit: cover; position: relative; z-index: 1; transition: opacity .2s; }
.infobox-wrapper .infobox-inner .infobox-image img[src*="mapico"],
.infobox-wrapper .infobox-inner .infobox-image img[src=""] { opacity: 0; } /* hide icon/empty — show shimmer instead */
/* Infobox overlaid labels */
.infobox-wrapper .infobox-inner .infobox-image .infobox-type,
.infobox-wrapper .infobox-inner .infobox-image .infobox-price,
.infobox-wrapper .infobox-inner .infobox-image .infobox-area { position: absolute; font-weight: 700; z-index: 1; }
.infobox-wrapper .infobox-inner .infobox-image .infobox-type { top: 8px; left: 10px; font-size: .75rem; color: #fff; text-shadow: 0 0 3px rgba(0,0,0,.7); }
.infobox-wrapper .infobox-inner .infobox-image .infobox-price { left: 10px; bottom: 10px; padding: 3px 8px; font-size: .85rem; color: var(--color-dark); background: var(--color-primary); border-radius: 3px; box-shadow: 0 1px 4px rgba(0,0,0,.25); z-index: 2; }
.infobox-wrapper .infobox-inner .infobox-image .infobox-area { right: 10px; bottom: 10px; font-size: .8rem; color: #fff; text-shadow: 0 0 3px rgba(0,0,0,.7); }
.infobox-wrapper .infobox-inner .infobox-image .infobox-area span { font-size: .65rem; font-weight: 400; }
/* Infobox text */
.infobox-wrapper .infobox-inner .infobox-description { padding: .6rem .75rem; }
.infobox-wrapper .infobox-inner .infobox-description .infobox-title { font-size: .8rem; font-weight: 600; line-height: 1.3; margin-bottom: .2rem; }
.infobox-wrapper .infobox-inner .infobox-description .infobox-title a { color: var(--color-dark); text-decoration: none; }
.infobox-wrapper .infobox-inner .infobox-description .infobox-title a:hover { color: var(--color-primary-dark); }
.infobox-wrapper .infobox-inner .infobox-description .infobox-location { font-size: .75rem; color: var(--color-text-light); }
/* Infobox pager (multiple offers at same location) */
.infobox-wrapper .infobox-pager { display: flex; align-items: center; justify-content: space-between; background: var(--color-bg-light); border-top: var(--line); font-size: .75rem; }
.infobox-wrapper .infobox-pager > div { display: inline-block; padding: .4rem .6rem; }
.infobox-wrapper .infobox-pager .button { padding: .35rem .6rem; width: 80px; text-align: center; background: var(--color-bg-light); transition: background .2s, color .2s; font-size: .72rem; }
.infobox-wrapper .infobox-pager .button:not(.disabled) { color: var(--color-dark); cursor: pointer; }
.infobox-wrapper .infobox-pager .button:not(.disabled):hover { background: var(--color-primary-light); }
.infobox-wrapper .infobox-pager .button.disabled { color: var(--color-text-muted); }
.infobox-wrapper .infobox-pager .button.prev { border-right: var(--line); }
.infobox-wrapper .infobox-pager .button.next { border-left: var(--line); }
.infobox-wrapper .infobox-pager .infobox-pager-info span:first-of-type { font-weight: 700; }
/* ── Newsletter: .widget-newsletter ── */
.widget-newsletter .form-control { width: 100%; padding: .65rem .85rem; border: var(--line); font-size: .9rem; font-family: var(--font-body); }
.widget-newsletter .btn { background: var(--color-primary); color: var(--color-dark); border: 2px solid var(--color-primary); padding: .65rem 1.5rem; font-weight: 600; font-size: .85rem; text-transform: uppercase; cursor: pointer; transition: all var(--transition); }
.widget-newsletter .btn:hover { background: var(--color-primary-dark); }
/* ── Agent Contact Sticky Links ── */
.asariplug-agent-contact-links { position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 900; display: flex; flex-direction: column; gap: .5rem; }
.asariplug-agent-contact-links a { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--color-primary); color: var(--color-dark); box-shadow: var(--shadow-lg); transition: all var(--transition); text-decoration: none; font-size: 1.2rem; border-radius: 50%; }
.asariplug-agent-contact-links a:hover { background: var(--color-primary-dark); transform: scale(1.1); }
/* ── Investment Table ── */
.investment-offers-table-wrapper { margin-top: 1rem; overflow-x: auto; }
.investment-offers-table { width: 100%; border-collapse: collapse; font-family: var(--font-body); }
.investment-offers-table th,
.investment-offers-table td { padding: .65rem .85rem; text-align: left; font-size: .85rem; border-bottom: var(--line); }
.investment-offers-table th { font-weight: 600; color: var(--color-text-light); background: var(--color-bg-light); text-transform: uppercase; font-size: .75rem; letter-spacing: .04em; }
.investment-offers-table tr:hover td { background: var(--color-primary-light); }
.investment-offers-table .gridjs-sort { cursor: pointer; border: none; background: none; padding: 0 .25rem; color: var(--color-text-muted); }
/* ── Sorting Select (offers page) ── */
.archive-sort .sort-select { padding: .45rem .85rem; border: var(--line); font-size: .85rem; font-family: var(--font-body); background: #fff; cursor: pointer; border-radius: var(--radius-sm); }
.archive-sort .sort-select:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(255,216,0,.15); }
.archive-sort label { font-size: .85rem; color: var(--color-text-light); }
/* ── Slider in Offer Cards ── */
.widget-offers .property .image._slider { position: relative; }
.widget-offers .property .image._slider .owl-carousel,
.widget-offers .property .image._slider .tns-outer { height: 100%; }
.widget-offers .property .image._slider .owl-stage-outer,
.widget-offers .property .image._slider .tns-ovh { height: 100%; }
.widget-offers .property .image._slider img { width: 100%; height: 100%; object-fit: cover; }
.widget-offers .property .image._slider .owl-nav button,
.widget-offers .property .image._slider .tns-controls button { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.5); color: #fff; border: none; width: 32px; height: 32px; font-size: 1rem; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2; transition: background var(--transition); }
.widget-offers .property .image._slider .owl-nav button:hover,
.widget-offers .property .image._slider .tns-controls button:hover { background: var(--color-primary); color: var(--color-dark); }
.widget-offers .property .image._slider .owl-prev,
.widget-offers .property .image._slider [data-controls="prev"] { left: 0; }
.widget-offers .property .image._slider .owl-next,
.widget-offers .property .image._slider [data-controls="next"] { right: 0; }
.widget-offers .property .image._slider .owl-dots { position: absolute; bottom: .5rem; left: 50%; transform: translateX(-50%); display: flex; gap: .3rem; }
.widget-offers .property .image._slider .owl-dot { width: 8px; height: 8px; background: rgba(255,255,255,.5); border: none; cursor: pointer; }
.widget-offers .property .image._slider .owl-dot.active { background: var(--color-primary); }
/* ═══════════════════════════════════════════
LOCATION PAGE
═══════════════════════════════════════════ */
/* Breadcrumbs bar */
.location-breadcrumbs { background: var(--color-bg-light); padding: .75rem 0; border-bottom: 1px solid var(--color-border); }
.location-breadcrumbs .ddre-breadcrumbs { margin-bottom: 0; }
.location-page .ddre-breadcrumbs { margin-bottom: 0; }
/* Hero */
.location-hero { background: var(--color-bg-light); padding: 2.5rem 0 3rem; }
.location-hero__inner { display: flex; gap: 3rem; align-items: flex-start; }
.location-hero__content { flex: 1; min-width: 0; }
.location-hero__badge { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .9rem; background: var(--color-primary-light); color: var(--color-dark); font-size: .8rem; font-weight: 600; border-radius: var(--radius-pill); margin-bottom: 1rem; letter-spacing: .01em; }
.location-hero__badge svg { color: var(--color-primary-dark); flex-shrink: 0; }
.location-hero__title { font-family: var(--font-heading); font-size: clamp(1.6rem, 3.5vw, 2.4rem); margin-bottom: .75rem; color: var(--color-dark); line-height: 1.2; }
.location-hero__title::after { content: ''; display: block; width: 50px; height: 2px; background: var(--color-primary); margin-top: .75rem; }
.location-hero__desc { max-width: 640px; line-height: 1.7; color: var(--color-text-light); font-size: .95rem; }
.location-hero__stats { display: flex; gap: 2rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: var(--line); }
.location-hero__stat { display: flex; flex-direction: column; gap: .15rem; }
.location-hero__stat-number { font-size: 1.75rem; font-weight: 700; color: var(--color-primary-dark); font-family: var(--font-heading); line-height: 1; }
.location-hero__stat-label { font-size: .8rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .05em; }
.location-hero__stat-value { font-size: .9rem; font-weight: 600; color: var(--color-dark); }
/* Hero aside — other types pills */
.location-hero__aside { flex-shrink: 0; width: 260px; background: #fff; border-radius: var(--radius); padding: 1.25rem; box-shadow: var(--shadow); border: 1px solid var(--color-border); }
.location-hero__aside-label { display: block; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-muted); margin-bottom: .75rem; }
.location-hero__aside .location-type-pills { display: flex; flex-direction: column; gap: .4rem; }
.location-hero__aside .type-link-pill { justify-content: space-between; border-radius: var(--radius-sm); padding: .5rem .75rem; font-size: .85rem; }
/* Offers section */
.location-offers { padding: 3rem 0 2rem; }
/* Other types grid */
.location-also { padding: 3rem 0 4rem; background: #fff; }
.location-also__subtitle { color: var(--color-text-muted); font-size: .9rem; margin-top: .35rem; }
.location-also .section-header { margin-bottom: 2rem; }
.location-also__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.location-also__card { display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1.5rem; background: var(--color-bg-light); border: 1px solid var(--color-border); border-radius: var(--radius); text-decoration: none; color: inherit; transition: all var(--transition); }
.location-also__card:hover { background: var(--color-primary-light); border-color: var(--color-primary); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.location-also__icon { width: 40px; height: 40px; flex-shrink: 0; color: var(--color-primary-dark); }
.location-also__icon svg { width: 100%; height: 100%; }
.location-also__info { flex: 1; min-width: 0; }
.location-also__name { display: block; font-weight: 600; font-size: .95rem; color: var(--color-dark); }
.location-also__count { display: block; font-size: .8rem; color: var(--color-text-muted); margin-top: .1rem; }
.location-also__arrow { flex-shrink: 0; color: var(--color-text-muted); transition: transform .2s ease; }
.location-also__card:hover .location-also__arrow { transform: translateX(3px); color: var(--color-primary-dark); }
/* Crosslinks */
.location-crosslinks { padding: 2rem 0 3rem; background: var(--color-bg-light); }
/* Location page CTA — reuse global cta-section */
.location-page .cta-section { margin-top: 0; }
/* Responsive */
@media (max-width: 900px) {
.location-hero__inner { flex-direction: column; gap: 1.5rem; }
.location-hero__aside { width: 100%; }
.location-hero__aside .location-type-pills { flex-direction: row; flex-wrap: wrap; }
.location-hero__aside .type-link-pill { flex: 0 0 auto; }
}
@media (max-width: 600px) {
.location-hero { padding: 1.5rem 0 2rem; }
.location-hero__stats { flex-direction: column; gap: 1rem; }
.location-also__grid { grid-template-columns: 1fr; }
.location-also { padding: 2rem 0 3rem; }
}
/* ═══════════════════════════════════════════
DARK SECTION OVERRIDES
═══════════════════════════════════════════ */
.section--dark .section-label { color: var(--color-primary); }
.section--dark .section-label::before { background: var(--color-primary); }
.section--dark .section-subtitle { color: rgba(255,255,255,.5); }
.section--dark .section-link { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.section--dark .section-link:hover { color: #fff; }
.section--dark .no-results { border-color: rgba(255,255,255,.08); background: transparent; }
.section--dark .no-results p { color: rgba(255,255,255,.5); }
.team-cta { margin-top: 2rem; }
/* ═══════════════════════════════════════════
OFFERS FILTER TABS
═══════════════════════════════════════════ */
.offers-filter-tabs { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1.5rem; background: none; }
.filter-tab { padding: .55rem 1.25rem; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-light); text-decoration: none; transition: all var(--transition); border: 1px solid #ddd; background: #fff; position: relative; white-space: nowrap; border-radius: var(--radius-pill); cursor: pointer; font-family: var(--font-body); }
.filter-tab:hover { background: var(--color-bg-light); color: var(--color-dark); border-color: var(--color-primary); }
.filter-tab.active { background: var(--color-primary); color: var(--color-dark); border-color: var(--color-primary); }
.filter-tab.active::after { display: none; }
@media (max-width: 1024px) {
.filter-tab { padding: .5rem 1rem; font-size: .7rem; }
}
@media (max-width: 768px) {
.offers-filter-tabs { gap: .3rem; }
.filter-tab { padding: .45rem .75rem; font-size: .68rem; }
}
@media (max-width: 480px) {
.offers-filter-tabs { gap: .25rem; }
.filter-tab { padding: .4rem .6rem; font-size: .62rem; letter-spacing: .02em; }
}
/* Home page variant — pill style */
.offers-filter-tabs--home { border: none; gap: .5rem; margin-bottom: 2rem; background: none; }
.offers-filter-tabs--home .filter-tab { border: 2px solid var(--color-border); padding: .5rem 1.25rem; font-size: .75rem; }
.offers-filter-tabs--home .filter-tab:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.offers-filter-tabs--home .filter-tab.active { border-color: var(--color-primary); background: var(--color-primary); }
.offers-filter-tabs--home .filter-tab.active::after { display: none; }
@media (max-width: 768px) {
.offers-filter-tabs--home .filter-tab { padding: .4rem .85rem; font-size: .7rem; }
}
@media (max-width: 480px) {
.offers-filter-tabs--home { gap: .3rem; }
.offers-filter-tabs--home .filter-tab { padding: .35rem .6rem; font-size: .65rem; }
}
/* Search engine — tablet breakpoint */
@media (max-width: 1024px) {
.asariplug_sengine { padding: 1.75rem 1.75rem 1.25rem; }
.asariplug_sengine_rowElast { grid-template-columns: repeat(2, 1fr) !important; gap: 1rem .85rem; }
}
@media (max-width: 640px) {
.asariplug_sengine { padding: 1.25rem 1rem 1rem; }
.asariplug_sengine_rowElast { grid-template-columns: 1fr !important; }
}
/* ═══════════════════════════════════════════
OFFERS SEARCH ENGINE WRAPPER
═══════════════════════════════════════════ */
.offers-search-engine { margin-bottom: 1.5rem; }
.offers-search-engine.is-collapsed {
display: none;
}
/* ═══════════════════════════════════════════
PREMIUM OFFER CARD UPGRADES
═══════════════════════════════════════════ */
/* Elevated card hover */
.widget-offers .property:hover { transform: translateY(-3px); }
/* Better image overlay gradient */
.widget-offers .property .image::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60px; background: linear-gradient(to top, rgba(0,0,0,.25), transparent); pointer-events: none; z-index: 1; }
/* Better price styling */
.widget-offers .property .price { font-size: 1.3rem; font-weight: 800; color: var(--color-dark); letter-spacing: -.01em; }
.widget-offers .property .price-m2 { font-size: .78rem; color: var(--color-text-muted); }
/* Better info padding */
.widget-offers .property .info { padding: 1.25rem 1.5rem 1.5rem; }
/* Better params with SVG icons */
.widget-offers .property .params { gap: 1.25rem; padding-bottom: 0; }
.widget-offers .property .params dd { font-weight: 500; color: var(--color-text); font-size: .82rem; }
.widget-offers .property .params dd::before { content: ''; display: inline-block; width: 13px; height: 13px; margin-right: .3rem; vertical-align: middle; background: no-repeat center/contain; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
/* Rooms: door icon */
.widget-offers .property .params dt[title="Liczba pokoi"] + dd::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='1'/%3E%3Ccircle cx='15' cy='12' r='1' fill='%23888' stroke='none'/%3E%3C/svg%3E"); }
/* Area: maximize/frame icon */
.widget-offers .property .params dt[title="Powierzchnia"] + dd::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3H5a2 2 0 0 0-2 2v3'/%3E%3Cpath d='M21 8V5a2 2 0 0 0-2-2h-3'/%3E%3Cpath d='M3 16v3a2 2 0 0 0 2 2h3'/%3E%3Cpath d='M16 21h3a2 2 0 0 0 2-2v-3'/%3E%3C/svg%3E"); }
/* Floor: layers icon */
.widget-offers .property .params dt[title="Piętro"] + dd::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 2 7 12 12 22 7 12 2'/%3E%3Cpolyline points='2 17 12 22 22 17'/%3E%3Cpolyline points='2 12 12 17 22 12'/%3E%3C/svg%3E"); }
/* Price: tag icon */
.widget-offers .property .params dt[title="Cena"] + dd::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'/%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'/%3E%3C/svg%3E"); }
/* Better location text */
.widget-offers .property .location { color: var(--color-text-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; margin-bottom: .5rem; }
/* Better title/name */
.widget-offers .property .name { font-size: .9rem; font-weight: 600; margin-bottom: .75rem; }
/* Link/button refinement */
.widget-offers .property .link-offer,
.widget-offers .property .links .btn { font-size: .75rem; padding: .55rem 1.5rem; letter-spacing: .04em; }
/* Stamp/promo overlay */
.widget-offers .property .image .stamp { position: absolute; top: .75rem; left: .75rem; z-index: 3; }
/* Better grid gap */
.widget-offers .holder { gap: 1.75rem; }
/* Cols-4 support */
.widget-offers.boxes.cols-4 .holder { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1200px) { .widget-offers.boxes.cols-4 .holder { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 1024px) { .widget-offers.boxes.cols-4 .holder { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .widget-offers.boxes.cols-4 .holder { grid-template-columns: 1fr; } }
/* ═══════════════════════════════════════════
FRONT PAGE — FEATURED OFFERS PREMIUM
═══════════════════════════════════════════ */
.section .asari-offers-wrapper { margin-top: 0; }
.section .section-header + .asari-offers-wrapper { margin-top: 2rem; }
/* ═══════════════════════════════════════════
RESPONSIVE — MOBILE IMPROVEMENTS
═══════════════════════════════════════════ */
@media (max-width: 768px) {
/* Container padding */
.container { padding: 0 1.25rem; }
.section { padding: 4rem 0; }
/* Compact archive header on mobile */
.archive-header { margin-bottom: 1rem; padding-bottom: 1rem; }
.archive-title { font-size: 1.5rem; }
.archive-description { font-size: .85rem; }
/* Toolbar stacking */
.archive-toolbar { flex-direction: column; align-items: flex-start; padding: .5rem 0; }
/* Better card spacing on mobile */
.widget-offers .holder { gap: 1rem; }
.widget-offers .property .info { padding: 1rem; }
.widget-offers .property .price { font-size: 1.15rem; }
.widget-offers .property .params { gap: .75rem; }
/* Search engine — full stack on mobile */
.asariplug_sengine { padding: 1.5rem 1.25rem 1.25rem; }
.asariplug_sengine_rowElast { grid-template-columns: 1fr !important; gap: .85rem; }
.asariplug_sengine_rowConf { grid-template-columns: 1fr 1fr; gap: .5rem; }
.asariplug_sengine_minmax { gap: .4rem; }
.asariplug_sengine select,
.asariplug_sengine input[type="text"],
.asariplug_sengine input[type="number"] { font-size: 16px; padding: .75rem 1rem; height: 48px; }
.asariplug_sengine input[type="submit"],
.asariplug_sengine .btn,
.asariplug_sengine button[type="submit"] { width: 100%; justify-content: center; padding: .85rem 1.5rem; height: 52px; font-size: .95rem; }
.asariplug_sengine input[type="button"] { width: 100%; text-align: center; }
/* Checkbox dropdown mobile */
.asariplug_sengine_checkselect_boxes { max-height: 200px; }
.asariplug_sengine_checkselect_label { height: 48px; }
/* Better row layout on mobile */
.widget-offers.rows .property .inner { flex-direction: column; }
.widget-offers.rows .property .image { width: 100%; aspect-ratio: 3/2; min-height: 0; }
/* Team cards spacing */
.widget-team .person { padding: 1.5rem 1rem; }
.widget-team .person .image { width: 120px; height: 156px; }
.widget-team .person .links .btn { padding: .35rem .75rem; font-size: .7rem; margin: .15rem .1rem; }
/* Property detail features */
.property-key-features { grid-template-columns: repeat(2, 1fr); }
/* Pagination mobile */
.widget-offers .pagination a,
.widget-team .pagination a { min-width: 38px; height: 38px; font-size: .8rem; }
/* Property header compact */
.property-header { padding: 1.25rem; margin-bottom: 1.5rem; }
.property-price-bar { padding: 1rem; flex-wrap: wrap; }
.property-price-main { font-size: 1.4rem; }
.property-tags { flex-wrap: wrap; }
/* Gallery compact */
.gallery-thumbs { gap: .25rem; }
.gallery-thumb { width: 70px; height: 46px; }
.gallery-nav { width: 36px; height: 36px; font-size: 1rem; }
/* Investment table */
.investment-offers-table { font-size: .8rem; }
.investment-offers-table th,
.investment-offers-table td { padding: .5rem .65rem; }
}
@media (max-width: 480px) {
.container { padding: 0 1rem; }
.section { padding: 2.5rem 0; }
.property-archive-section { padding: 1.5rem 0; }
/* Single column offers - larger cards */
.widget-offers .property .image { aspect-ratio: 16/10; }
.widget-offers .property .price { font-size: 1.2rem; }
.widget-offers .property .info { padding: .85rem; }
.widget-offers .property .links .btn,
.widget-offers .property .link-offer { padding: .45rem 1rem; font-size: .7rem; }
/* Team on small screens */
.widget-team .person .image { width: 100px; height: 130px; }
.widget-team .person .name { font-size: .85rem; }
/* Property detail key features single col */
.property-key-features { grid-template-columns: 1fr 1fr; }
.key-feature { padding: 1rem .75rem; }
/* Property description/details compact */
.property-description,
.property-details-table,
.property-media { padding: 1.25rem; }
.details-table th,
.details-table td { padding: .65rem .75rem; font-size: .85rem; }
.details-table th { width: 40%; }
/* Hero compact */
.hero-section { min-height: 100svh; padding: 7.5rem 0 3rem; margin-top: -70px; align-items: flex-start; }
.hero-content { padding-top: 0; }
.hero-subtitle { font-size: .9rem; margin-bottom: 2rem; }
.hero-label { font-size: .65rem; padding: .4rem 1rem; }
.hero-slider-dots { bottom: 1.25rem; }
/* Stats bar compact */
.stat-number { font-size: 1.8rem; }
.stat-label { font-size: .7rem; }
.stat-item { padding: 1.25rem 1rem; }
/* Search form compact */
.property-search { padding: 1.25rem; }
.search-field label { font-size: .65rem; }
.search-select, .search-input { font-size: 16px; padding: .6rem .75rem; }
/* Contact form */
.widget-contact-form .form-control { font-size: 16px; }
.sidebar-contact-form { padding: 1.25rem; }
/* Sections headers */
.section-header { margin-bottom: 1.5rem; padding-bottom: .75rem; flex-direction: column; align-items: flex-start; gap: .75rem; }
.section-header--center { align-items: center; }
.section-link { font-size: .72rem; padding: .35rem 1rem; }
}
/* ═══════════════════════════════════════════
PROPERTY SINGLE — RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 768px) {
.property-layout { grid-template-columns: 1fr !important; gap: 1.5rem !important; }
.property-sidebar { position: static !important; }
.property-map-section h2,
.property-description h2,
.property-details-table h2,
.property-media h2 { font-size: 1.1rem; }
}
@media (max-width: 480px) {
.property-layout { gap: 1rem !important; }
}
/* ═══════════════════════════════════════════
ANIMATIONS — Scroll-triggered, Modern
═══════════════════════════════════════════ */
.fade-in { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }
/* Scroll animations — subtle */
.animate-on-scroll { opacity: 0; transform: translateY(20px); transition: opacity .5s cubic-bezier(.4,0,.2,1), transform .5s cubic-bezier(.4,0,.2,1); }
.animate-on-scroll.visible { opacity: 1; transform: translateY(0); }
/* Stagger children delays */
.stagger-children > *:nth-child(1) { transition-delay: 0s; }
.stagger-children > *:nth-child(2) { transition-delay: .06s; }
.stagger-children > *:nth-child(3) { transition-delay: .12s; }
.stagger-children > *:nth-child(4) { transition-delay: .18s; }
.stagger-children > *:nth-child(5) { transition-delay: .24s; }
.stagger-children > *:nth-child(6) { transition-delay: .3s; }
.stagger-children > *:nth-child(7) { transition-delay: .36s; }
.stagger-children > *:nth-child(8) { transition-delay: .42s; }
/* Slide variants */
.animate-slide-left { opacity: 0; transform: translateX(-30px); transition: opacity .5s cubic-bezier(.4,0,.2,1), transform .5s cubic-bezier(.4,0,.2,1); }
.animate-slide-right { opacity: 0; transform: translateX(30px); transition: opacity .5s cubic-bezier(.4,0,.2,1), transform .5s cubic-bezier(.4,0,.2,1); }
.animate-slide-left.visible, .animate-slide-right.visible { opacity: 1; transform: translateX(0); }
/* Scale-in variant */
.animate-scale { opacity: 0; transform: scale(.95); transition: opacity .5s cubic-bezier(.4,0,.2,1), transform .5s cubic-bezier(.4,0,.2,1); }
.animate-scale.visible { opacity: 1; transform: scale(1); }
/* Title typing — character-by-character reveal */
.title-typing .char {
opacity: 0;
transition: opacity .12s ease;
}
.title-typing.visible .char {
opacity: 1;
}
/* Gold underline grows from left after text finishes typing */
.title-typing::after {
transform: scaleX(0);
transform-origin: left;
transition: transform .4s cubic-bezier(.16,1,.3,1);
}
.title-typing.visible::after {
transform: scaleX(1);
transition-delay: var(--underline-delay, .6s);
}
/* Section label fade-up before title */
.label-reveal {
opacity: 0;
transform: translateY(10px);
transition: opacity .4s cubic-bezier(.4,0,.2,1), transform .4s cubic-bezier(.4,0,.2,1);
}
.label-reveal.visible {
opacity: 1;
transform: translateY(0);
}
/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
.animate-on-scroll, .animate-slide-left, .animate-slide-right, .animate-scale, .fade-in,
.label-reveal { opacity: 1; transform: none; transition: none; }
.title-typing .char { opacity: 1; transition: none; }
.title-typing::after { transform: scaleX(1); transition: none; }
}
/* ══════════════════════════════════════════════════════════════
SELLER TOOLS — Nav, Wizard, Quiz, Calculators, FAQ
══════════════════════════════════════════════════════════════ */
/* ── Tools Nav (sticky) ── */
.sell-tools-nav { position: sticky; top: 80px; z-index: 90; background: var(--color-dark); border-bottom: 1px solid rgba(255,255,255,.08); }
@media (max-width: 768px) { .sell-tools-nav { top: 60px; } }
.sell-tools-nav-inner { display: flex; gap: .25rem; overflow-x: auto; padding: .5rem 0; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.sell-tools-nav-inner::-webkit-scrollbar { display: none; }
.sell-nav-item { display: flex; align-items: center; gap: .4rem; padding: .55rem 1rem; color: rgba(255,255,255,.6); font-size: .82rem; font-weight: 500; text-decoration: none; border-radius: var(--radius-md); white-space: nowrap; transition: all .2s; }
.sell-nav-item:hover { color: #fff; background: rgba(255,255,255,.06); }
.sell-nav-item.active { color: var(--color-primary); background: rgba(255,215,0,.08); }
/* ── Wizard ── */
.wizard-step { display: none; }
.wizard-step.active { display: block; animation: fadeUp .3s ease; }
.wizard-step-title { font-size: 1.15rem; font-weight: 600; margin-bottom: 1.25rem; }
.wizard-type-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.wizard-type-card { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 1.5rem 1rem; border: 2px solid #e8e8e8; border-radius: var(--radius-lg); cursor: pointer; transition: all .2s; text-align: center; }
.wizard-type-card input { position: absolute; opacity: 0; pointer-events: none; }
.wizard-type-card:hover { border-color: var(--color-primary); }
.wizard-type-card.selected, .wizard-type-card:has(input:checked) { border-color: var(--color-primary); background: rgba(255,215,0,.06); box-shadow: 0 0 0 3px rgba(255,215,0,.15); }
.wizard-type-card span { font-weight: 600; font-size: .9rem; }
.wizard-progress { height: 4px; background: #e8e8e8; border-radius: 2px; margin: 1.5rem 0 1rem; overflow: hidden; }
.wizard-progress-bar { height: 100%; background: var(--color-primary); border-radius: 2px; transition: width .4s ease; }
.wizard-nav { display: flex; justify-content: space-between; gap: 1rem; }
/* ── Quiz ── */
.quiz-container { max-width: 700px; margin: 0 auto; }
.quiz-question { display: none; }
.quiz-question.active { display: block; animation: fadeUp .3s ease; }
.quiz-question h3 { font-size: 1.1rem; font-weight: 600; margin-bottom: 1rem; }
.quiz-answers { display: flex; flex-direction: column; gap: .5rem; }
.quiz-answer { padding: .85rem 1.25rem; border: 2px solid #e8e8e8; border-radius: var(--radius-md); background: #fff; cursor: pointer; text-align: left; font-size: .95rem; transition: all .2s; }
.quiz-answer:hover { border-color: var(--color-primary); background: rgba(255,215,0,.04); }
.quiz-answer.selected { border-color: var(--color-primary); background: var(--color-primary); color: var(--color-dark); font-weight: 600; pointer-events: none; }
.quiz-progress { height: 4px; background: #e8e8e8; border-radius: 2px; margin-top: 1.5rem; overflow: hidden; }
.quiz-progress-bar { height: 100%; background: var(--color-primary); border-radius: 2px; transition: width .4s ease; }
.quiz-result { text-align: center; padding: 2rem 1rem; }
.quiz-result-icon { font-size: 3rem; margin-bottom: .75rem; }
.quiz-result-title { font-size: 1.4rem; font-weight: 700; margin-bottom: .75rem; }
.quiz-result-desc { color: var(--color-muted); margin-bottom: 1.5rem; max-width: 500px; margin-left: auto; margin-right: auto; }
/* ── Calculators ── */
.calc-container { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: start; }
.calc-inputs { padding: 1.75rem; background: #fff; border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); }
.calc-results { padding: 1.75rem; background: var(--color-dark); color: #fff; border-radius: var(--radius-xl); }
.calc-results h3 { font-size: 1.05rem; font-weight: 600; margin-bottom: 1rem; padding-bottom: .75rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.calc-result-rows { display: flex; flex-direction: column; gap: .6rem; }
.calc-row { display: flex; justify-content: space-between; align-items: center; font-size: .9rem; padding: .3rem 0; color: rgba(255,255,255,.7); }
.calc-row span:last-child { font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; }
.calc-row--total { border-top: 1px solid rgba(255,255,255,.15); padding-top: .75rem; margin-top: .25rem; font-size: 1rem; }
.calc-row--total span { font-weight: 700; color: #fff; }
.calc-row--highlight { background: rgba(255,215,0,.1); margin: .25rem -.75rem 0; padding: .75rem; border-radius: var(--radius-md); }
.calc-row--highlight span { color: var(--color-primary) !important; font-size: 1.1rem; }
.calc-disclaimer { font-size: .75rem; color: rgba(255,255,255,.35); margin-top: 1.25rem; line-height: 1.4; }
.calc-badge { padding: .5rem 1rem; border-radius: var(--radius-md); font-weight: 700; font-size: .9rem; text-align: center; margin-bottom: 1rem; }
.calc-badge--green { background: rgba(34,197,94,.15); color: #22c55e; }
.calc-slider-row { display: flex; align-items: center; gap: 1rem; }
.calc-slider { flex: 1; accent-color: var(--color-primary); }
.calc-slider-val { font-weight: 600; min-width: 3.5rem; text-align: right; }
.calc-hint { cursor: help; color: var(--color-primary); font-weight: 700; }
.calc-small-hint { font-size: .78rem; color: var(--color-muted); margin-top: .35rem; }
.text-green { color: #22c55e !important; }
/* ── Spadek / Darowizna Tabs ── */
.sd-tabs { display: flex; gap: .5rem; justify-content: center; margin-bottom: 2rem; }
.sd-tab { padding: .65rem 1.75rem; border: 2px solid #e8e8e8; border-radius: var(--radius-md); background: #fff; cursor: pointer; font-size: .95rem; font-weight: 600; transition: all .2s; }
.sd-tab.active { border-color: var(--color-primary); background: var(--color-primary); color: var(--color-dark); }
.sd-panel { display: none; }
.sd-panel.active { display: grid; }
/* ── FAQ ── */
.faq-list { max-width: 800px; margin: 0 auto; }
.faq-item { border-bottom: 1px solid #e8e8e8; }
.faq-question { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 1.1rem 0; background: none; border: none; cursor: pointer; font-size: 1rem; font-weight: 600; text-align: left; color: var(--color-dark); transition: color .2s; }
.faq-question:hover { color: var(--color-primary); }
.faq-question svg { flex-shrink: 0; transition: transform .3s; }
.faq-item.is-open .faq-question svg { transform: rotate(180deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height .35s ease, padding .35s ease; }
.faq-item.is-open .faq-answer { max-height: 300px; padding-bottom: 1rem; }
.faq-answer p { color: var(--color-muted); font-size: .92rem; line-height: 1.65; }
/* Podstrony Sprzedaj Mądrze używają — natywny toggle
nie dodaje klasy .is-open, więc max-height:0 nie znika i odpowiedzi są
przycięte (klient: "FAQ – poucinane odpowiedzi"). Odblokowujemy zacisk
gdy jest otwarte. */
details.faq-item .faq-answer { padding-bottom: 0; }
details.faq-item[open] > .faq-answer { max-height: none; overflow: visible; padding-bottom: 1rem; }
/* ── Animations ── */
@keyframes fadeUp {
from { opacity: 0; transform: translateY(12px); }
to { opacity: 1; transform: translateY(0); }
}
/* ── Seller Tools Responsive ── */
@media (max-width: 900px) {
.calc-container { grid-template-columns: 1fr; }
.wizard-type-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
.sell-nav-item { font-size: .75rem; padding: .45rem .7rem; }
.sell-nav-item svg { width: 16px; height: 16px; }
.wizard-type-grid { grid-template-columns: 1fr 1fr; gap: .75rem; }
.wizard-type-card { padding: 1rem .75rem; }
.sd-tabs { flex-wrap: wrap; }
}
/* ── Print ── */
@media print {
.site-header, .site-footer, .property-sidebar, .ddre-breadcrumbs, .ddre-contextual-links, .ddre-related-properties, .property-search, .stats-bar { display: none !important; }
.property-layout { grid-template-columns: 1fr !important; }
body { font-size: 12pt; color: #000; }
}
/* ═══════════════════════════════════════════════════════════════════════
SPRZEDAJ → LANDING PAGES (Wycena, Quiz, Koszty, PIT, Spadek/Darowizna)
═══════════════════════════════════════════════════════════════════════ */
/* Nav dropdown caret — desktop */
.main-menu > li.menu-item-has-children > a::after {
content: '';
display: inline-block;
width: 6px; height: 6px;
border-right: 2px solid currentColor;
border-bottom: 2px solid currentColor;
transform: rotate(45deg) translate(-2px, -2px);
margin-left: .45rem;
opacity: .55;
transition: transform .2s ease, opacity .2s ease;
vertical-align: middle;
}
.main-menu > li.menu-item-has-children:hover > a::after { opacity: 1; transform: rotate(-135deg) translate(-1px, -3px); }
/* Nav dropdown caret — mobile (always expanded under parent) */
.mobile-menu-list > li.menu-item-has-children > a::after {
content: '▾';
margin-left: auto;
padding-left: .5rem;
opacity: .45;
font-size: .9em;
}
/* Section CTA below each page-sell.php block — link to dedicated landing */
.section-learn-more {
margin-top: 2.5rem;
text-align: center;
}
.section-learn-more .btn {
display: inline-flex;
align-items: center;
gap: .5rem;
}
.section-learn-more .btn svg { flex-shrink: 0; }
/* Parallax divider — tylko renderowany gdy Customizer ma obraz */
.parallax-divider {
height: 420px;
background-size: cover;
background-position: center;
background-attachment: fixed;
position: relative;
margin: 0;
}
.parallax-divider-overlay {
position: absolute;
inset: 0;
background: linear-gradient(135deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.15) 100%);
}
@media (max-width: 768px) {
.parallax-divider { height: 280px; background-attachment: scroll; }
}
/* Expert video section */
.expert-video-section .expert-video-embed {
max-width: 820px;
margin: 2rem auto 0;
aspect-ratio: 16 / 9;
border-radius: var(--radius);
overflow: hidden;
box-shadow: var(--shadow-lg);
background: #000;
}
.expert-video-section .expert-video-embed iframe,
.expert-video-section .expert-video-embed video {
width: 100%;
height: 100%;
border: none;
display: block;
}
.expert-video-caption {
text-align: center;
margin-top: 1rem;
color: var(--color-text-light);
font-size: .9rem;
font-style: italic;
}
/* Section sub headline */
.section-sub {
max-width: 680px;
margin: .75rem auto 0;
color: var(--color-text-light);
font-size: 1rem;
line-height: 1.6;
}
/* Landing content inner (the_content() wrapper) */
.landing-content-inner {
max-width: 780px;
margin: 0 auto;
font-size: 1.02rem;
line-height: 1.75;
}
.landing-content-inner h2,
.landing-content-inner h3 { margin-top: 2rem; margin-bottom: 1rem; }
.landing-content-inner p { margin-bottom: 1.25rem; }
.landing-content-inner ul, .landing-content-inner ol { margin: 0 0 1.25rem 1.5rem; }
.landing-content-inner li { margin-bottom: .5rem; }
/* ═══ COST GRID (Koszty landing) ═══ */
.cost-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin-top: 2.5rem;
}
.cost-card {
background: #fff;
border-radius: var(--radius);
padding: 2rem 1.75rem;
box-shadow: var(--shadow);
transition: transform .25s ease, box-shadow .25s ease;
border: 1px solid var(--color-border);
}
.cost-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.cost-card-icon { font-size: 2.5rem; margin-bottom: 1rem; }
.cost-card h3 { font-size: 1.25rem; margin-bottom: .5rem; color: var(--color-dark); }
.cost-card-amount {
font-size: 1.15rem;
font-weight: 700;
color: var(--color-primary-dark);
margin-bottom: .75rem;
padding-bottom: .75rem;
border-bottom: 2px solid var(--color-primary-light);
}
.cost-card p { color: var(--color-text-light); font-size: .92rem; line-height: 1.6; }
.cost-card-link {
display: inline-block;
margin-top: 1rem;
color: var(--color-primary-dark);
font-weight: 600;
font-size: .88rem;
text-decoration: none;
}
.cost-card-link:hover { text-decoration: underline; }
/* Cost breakdown table */
.cost-breakdown-table {
max-width: 860px;
margin: 2rem auto 0;
overflow-x: auto;
}
.cost-breakdown-table table {
width: 100%;
border-collapse: collapse;
background: #fff;
box-shadow: var(--shadow);
border-radius: var(--radius);
overflow: hidden;
}
.cost-breakdown-table th,
.cost-breakdown-table td {
padding: .9rem 1rem;
text-align: left;
border-bottom: 1px solid var(--color-border);
font-size: .92rem;
}
.cost-breakdown-table thead th {
background: var(--color-dark);
color: #fff;
font-size: .82rem;
text-transform: uppercase;
letter-spacing: .05em;
}
.cost-breakdown-table .cost-total td {
background: var(--color-primary-light);
font-size: 1rem;
border-bottom: none;
}
/* ═══ SCENARIO CARDS (PIT landing — 3 scenariusze) ═══ */
.scenario-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 1.5rem;
margin-top: 2.5rem;
}
.scenario-card {
background: #fff;
border-radius: var(--radius);
padding: 2rem 1.75rem;
box-shadow: var(--shadow);
border-top: 5px solid var(--color-border);
position: relative;
}
.scenario-card--green { border-top-color: #22c55e; }
.scenario-card--yellow { border-top-color: #f59e0b; }
.scenario-card--red { border-top-color: #ef4444; }
.scenario-card-badge {
display: inline-block;
padding: .35rem .75rem;
border-radius: 999px;
font-size: .78rem;
font-weight: 700;
margin-bottom: 1rem;
background: var(--color-bg-light);
}
.scenario-card--green .scenario-card-badge { background: #dcfce7; color: #15803d; }
.scenario-card--yellow .scenario-card-badge { background: #fef3c7; color: #92400e; }
.scenario-card--red .scenario-card-badge { background: #fee2e2; color: #991b1b; }
.scenario-card h3 { font-size: 1.2rem; margin-bottom: .75rem; color: var(--color-dark); }
.scenario-card p { color: var(--color-text-light); font-size: .92rem; line-height: 1.65; margin-bottom: .75rem; }
.scenario-example {
margin-top: 1rem;
padding: .75rem 1rem;
background: var(--color-bg-light);
border-radius: var(--radius-sm);
font-size: .85rem;
color: var(--color-text);
}
/* ═══ PIT CALCULATION STEPS ═══ */
.pit-calculation {
max-width: 860px;
margin: 2rem auto 0;
display: grid;
gap: 1.25rem;
}
.pit-step {
background: #fff;
padding: 1.5rem 1.75rem;
border-radius: var(--radius);
box-shadow: var(--shadow);
display: grid;
grid-template-columns: auto 1fr;
gap: 1rem 1.25rem;
align-items: start;
}
.pit-step-num {
grid-row: 1 / 3;
display: flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
border-radius: 50%;
background: var(--color-primary-light);
color: var(--color-primary-dark);
font-weight: 800;
font-size: 1.2rem;
}
.pit-step h3 { font-size: 1.1rem; margin: 0; color: var(--color-dark); }
.pit-step p { color: var(--color-text-light); font-size: .92rem; margin: 0; line-height: 1.6; }
.pit-example-box {
max-width: 860px;
margin: 2.5rem auto 0;
padding: 2rem 2rem;
background: var(--color-primary-light);
border-radius: var(--radius);
border-left: 4px solid var(--color-primary);
}
.pit-example-box h3 { font-size: 1.2rem; margin-bottom: 1rem; color: var(--color-dark); }
.pit-example-box ul { margin: 0 0 1.25rem 1.25rem; }
.pit-example-box li { padding: .3rem 0; color: var(--color-text); }
.pit-example-box p { margin: .5rem 0; color: var(--color-text); }
/* ═══ TWO-COLUMN COMPARE (Spadek / Darowizna) ═══ */
.two-col-compare {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
margin-top: 2.5rem;
}
@media (max-width: 900px) { .two-col-compare { grid-template-columns: 1fr; } }
.compare-card {
background: #fff;
padding: 2.25rem;
border-radius: var(--radius);
box-shadow: var(--shadow);
border-top: 5px solid var(--color-primary);
}
.compare-card h3 { font-size: 1.35rem; margin-bottom: .5rem; color: var(--color-dark); }
.compare-card-lead {
color: var(--color-text-light);
font-size: .95rem;
margin-bottom: 1.25rem;
padding-bottom: 1.25rem;
border-bottom: 1px solid var(--color-border);
}
.compare-card ul { list-style: none; padding: 0; margin: 0; }
.compare-card li {
padding: .65rem 0 .65rem 1.75rem;
position: relative;
font-size: .92rem;
line-height: 1.55;
color: var(--color-text);
border-bottom: 1px solid var(--color-bg-light);
}
.compare-card li:last-child { border-bottom: none; }
.compare-card li::before {
content: '';
position: absolute;
left: 0;
top: 1.1rem;
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--color-primary);
}
.compare-card strong { color: var(--color-dark); }
/* ═══ LANDING FORM SECTION (formularz na białym tle — np. wycena) ═══ */
.landing-form-section .landing-form-wrapper {
max-width: 780px;
margin: 0 auto;
}
.landing-form-section .landing-form-body {
margin-top: 2.5rem;
background: #fff;
padding: 2.5rem 2rem;
border-radius: var(--radius-lg);
box-shadow: var(--shadow);
border: 1px solid var(--color-border);
}
.landing-form-section .landing-form-body form,
.landing-form-section .landing-form-body .asariplug_contactform {
max-width: 100%;
}
.landing-form-section .landing-form-body input[type="text"],
.landing-form-section .landing-form-body input[type="email"],
.landing-form-section .landing-form-body input[type="tel"],
.landing-form-section .landing-form-body textarea,
.landing-form-section .landing-form-body select {
width: 100%;
padding: .75rem 1rem;
border: 1px solid var(--color-border);
border-radius: var(--radius-sm);
font-size: .95rem;
margin-bottom: .75rem;
}
.landing-form-section .landing-form-body label {
display: block;
font-size: .85rem;
font-weight: 600;
color: var(--color-text);
margin-bottom: .35rem;
}
@media (max-width: 640px) {
.landing-form-section .landing-form-body { padding: 1.5rem 1.25rem; }
}
/* ═══ LANDING CTA (bottom of each landing) ═══ */
.landing-cta-section {
background: linear-gradient(135deg, var(--color-dark) 0%, #0f172a 100%);
color: #fff;
padding: 5rem 0;
}
.landing-cta-box {
max-width: 640px;
margin: 0 auto;
text-align: center;
}
.landing-cta-box h2 {
font-size: 2rem;
color: #fff;
margin-bottom: 1rem;
line-height: 1.25;
}
.landing-cta-box p {
color: rgba(255, 255, 255, .75);
font-size: 1.05rem;
margin-bottom: 2rem;
line-height: 1.6;
}
.landing-cta-box .btn-lg {
font-size: 1rem;
padding: 1rem 2.25rem;
}
/* ═══ FAQ LIST — wspólny card-style dla obu wariantów ═══
page-sell.php używa