
.sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}

:root { --navy: #0E2A47;
 --navy-2: #12385f;
 --teal: #16B8A6;
 --teal-2: #0d9488;
 --coral: #FF7A59;
 --coral-2: #ff5d3b;
 --sand: #F7EFE5;
 --cream: #FFFBF4;
 --ink: #172033;
 --muted: #65758b;
 --line: #e6edf5;
 --soft: #f6f8fb;
 --white: #fff;
 --danger: #ef4444;
 --success: #10b981;
 --warning: #f59e0b;
 --info: #3b82f6;
 --shadow-xs: 0 1px 2px rgba(14,42,71,.06);
 --shadow-sm: 0 8px 24px rgba(14,42,71,.08);
 --shadow-md: 0 18px 50px rgba(14,42,71,.12);
 --shadow-lg: 0 26px 80px rgba(14,42,71,.18);
 --radius-sm: 10px;
 --radius: 18px;
 --radius-lg: 28px;
 --radius-xl: 38px;
 --container: 1180px;
 --header-h: 78px;
 --ease: cubic-bezier(.2, .8, .2, 1)
}

* { box-sizing: border-box }

html {
scroll-behavior: smooth;
-webkit-text-size-adjust: 100%
}

body {
margin: 0;
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
background: var(--cream);
color: var(--ink);
line-height: 1.6;
overflow-x: hidden
}

body:before {
content: "";
position: fixed;
inset: 0;
z-index: -2;
background: radial-gradient(circle at 10% 0%, rgba(255,122,89,.13), transparent 28rem), radial-gradient(circle at 90% 10%, rgba(22,184,166,.14), transparent 30rem), linear-gradient(180deg, #fff 0%, #fffbf4 46%, #f8fafc 100%)
}

a {
color: inherit;
text-decoration: none
}

img, svg {
display: block;
max-width: 100%
}

button, input, select, textarea { font: inherit }

button { cursor: pointer }

p, h1, h2, h3, h4 { margin-top: 0 }

.container {
width: min(100% - 32px, var(--container));
margin-inline: auto
}

.main-content { min-height: 60vh }

.skip-link {
position: absolute;
left: 16px;
top: -80px;
z-index: 9999;
padding: 10px 14px;
border-radius: 999px;
background: var(--navy);
color: white
}

.skip-link:focus { top: 14px }

/* header */
.site-header {
position: sticky;
top: 0;
z-index: 1000;
background: rgba(255,251,244,.78);
backdrop-filter: blur(18px);
border-bottom: 1px solid rgba(230,237,245,.7)
}

.nav-shell {
height: var(--header-h);
display: flex;
align-items: center;
gap: 22px
}

.brand {
display: inline-flex;
align-items: center;
gap: 11px;
font-weight: 900;
letter-spacing: -.045em;
white-space: nowrap
}

.brand-mark {
width: 44px;
height: 44px;
display: grid;
place-items: center;
border-radius: 15px;
background: white;
color: var(--navy);
box-shadow: var(--shadow-sm);
border: 1px solid rgba(230,237,245,.9)
}

.brand-mark svg {
width: 37px;
height: 37px
}

.brand-word {
font-size: 1.45rem;
line-height: 1
}

.brand-word span { color: var(--coral) }

.brand-word strong {
color: var(--teal);
font-weight: 900
}

.brand-word em {
font-size: .78em;
font-style: normal;
color: var(--navy);
letter-spacing: -.035em
}

.nav-menu {
display: flex;
align-items: center;
gap: 6px;
margin-left: auto
}

.nav-link {
padding: 10px 13px;
border-radius: 999px;
color: #41536a;
font-weight: 700;
font-size: .94rem;
transition: .22s var(--ease)
}

.nav-link:hover, .nav-link.active {
background: #fff;
color: var(--navy);
box-shadow: var(--shadow-xs)
}

.nav-actions {
display: flex;
align-items: center;
gap: 10px
}

.language-pill {
display: flex;
gap: 4px;
padding: 4px;
background: #fff;
border: 1px solid var(--line);
border-radius: 999px;
box-shadow: var(--shadow-xs)
}

.language-pill a {
font-size: .78rem;
font-weight: 900;
color: var(--muted);
padding: 5px 8px;
border-radius: 999px
}

.language-pill a.active {
background: var(--navy);
color: white
}

.icon-btn {
position: relative;
width: 42px;
height: 42px;
display: grid;
place-items: center;
background: white;
border: 1px solid var(--line);
border-radius: 999px;
box-shadow: var(--shadow-xs)
}

.icon-btn span {
position: absolute;
right: -4px;
top: -5px;
background: var(--coral);
color: white;
min-width: 20px;
height: 20px;
border-radius: 999px;
display: grid;
place-items: center;
font-size: .72rem;
font-weight: 900;
border: 2px solid white
}

.nav-toggle {
display: none;
margin-left: auto;
width: 44px;
height: 44px;
border: 1px solid var(--line);
border-radius: 14px;
background: white
}

.nav-toggle span {
display: block;
width: 19px;
height: 2px;
background: var(--navy);
margin: 4px auto;
border-radius: 999px;
transition: .22s var(--ease)
}

/* buttons */
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
border: 0;
border-radius: 999px;
padding: 11px 17px;
font-weight: 900;
line-height: 1.1;
transition: .22s var(--ease);
white-space: nowrap
}

.btn:hover { transform: translateY(-2px) }

.btn-primary {
background: linear-gradient(135deg, var(--coral), var(--coral-2));
color: white;
box-shadow: 0 12px 30px rgba(255,122,89,.28)
}

.btn-secondary {
background: var(--navy);
color: white;
box-shadow: 0 12px 28px rgba(14,42,71,.2)
}

.btn-ghost {
background: #fff;
color: var(--navy);
border: 1px solid var(--line);
box-shadow: var(--shadow-xs)
}

.btn-light {
background: #fff;
color: var(--navy);
border: 1px solid rgba(255,255,255,.65);
box-shadow: var(--shadow-sm)
}

.btn-outline {
border: 1.5px solid var(--navy);
color: var(--navy);
background: transparent
}

.btn-large {
padding: 15px 22px;
font-size: 1rem
}

.btn-small, .btn-sm {
padding: 8px 12px;
font-size: .86rem
}

.btn-danger {
background: var(--danger);
color: white
}

.btn-success {
background: var(--success);
color: white
}

.btn-nav { padding-inline: 16px }

/* hero */
.hero-redesign {
position: relative;
padding: 80px 0 54px;
overflow: hidden
}

.hero-gradient {
position: absolute;
inset: 0;
z-index: -1;
background: linear-gradient(135deg, rgba(255,122,89,.12), rgba(22,184,166,.1) 44%, rgba(247,239,229,.45))
}

.hero-grid {
display: grid;
 grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
gap: 54px;
align-items: center
}

.hero-kicker, .eyebrow {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--teal-2);
text-transform: uppercase;
letter-spacing: .12em;
font-size: .78rem;
font-weight: 950
}

.hero-kicker span, .eyebrow:before {
content: "";
width: 9px;
height: 9px;
border-radius: 50%;
background: var(--coral);
box-shadow: 0 0 0 7px rgba(255,122,89,.13)
}

.hero-content h1 {
font-size: clamp(2.55rem, 4vw, 3.75rem);
letter-spacing: -.075em;
line-height: .96;
margin: 16px 0 20px;
color: var(--navy)
}

.hero-content p {
font-size: clamp(1.05rem, 1.5vw, 1.28rem);
color: #53657c;
max-width: 690px
}

.hero-search-card {
margin: 28px 0 20px;
background: rgba(255,255,255,.88);
border: 1px solid rgba(230,237,245,.95);
border-radius: 26px;
padding: 9px;
display: grid;
grid-template-columns: 1.1fr 1fr auto;
gap: 8px;
box-shadow: var(--shadow-md);
backdrop-filter: blur(10px)
}

.hero-search-card label {
display: flex;
flex-direction: column;
gap: 4px;
background: #f8fafc;
border-radius: 18px;
padding: 12px 14px
}

.hero-search-card label span {
font-size: .74rem;
font-weight: 900;
color: var(--muted);
text-transform: uppercase;
letter-spacing: .08em
}

.hero-search-card input {
border: 0;
outline: 0;
background: transparent;
color: var(--navy);
font-weight: 700;
min-width: 0
}

.hero-search-card button {
border-radius: 19px;
padding-inline: 24px
}

.hero-actions, .cta-buttons {
display: flex;
gap: 12px;
flex-wrap: wrap
}

.trust-strip {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin-top: 26px
}

.trust-strip span {
padding: 7px 12px;
border-radius: 999px;
background: #fff;
border: 1px solid var(--line);
font-size: .82rem;
font-weight: 800;
color: #53657c
}

.hero-showcase {
min-height: 560px;
position: relative
}

.showcase-map {
position: relative;
height: 560px;
border-radius: 42px;
background: linear-gradient(145deg, #fff 0, #f7efe5 42%, #eafffb 100%);
box-shadow: var(--shadow-lg);
border: 1px solid rgba(230,237,245,.9);
overflow: hidden
}

.showcase-map:before {
content: "";
position: absolute;
inset: 45px;
background-image: linear-gradient(rgba(14,42,71,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(14,42,71,.06) 1px, transparent 1px);
background-size: 48px 48px;
border-radius: 30px
}

.showcase-map:after {
content: "";
position: absolute;
left: 19%;
top: 21%;
width: 58%;
height: 58%;
border: 2px dashed rgba(22,184,166,.45);
border-radius: 50%;
animation: spin 26s linear infinite
}

.map-pin {
position: absolute;
width: 18px;
height: 18px;
border-radius: 50%;
background: var(--coral);
z-index: 2;
box-shadow: 0 0 0 10px rgba(255,122,89,.15);
animation: pulse 2.2s infinite
}

.pin-a {
left: 28%;
top: 23%
}

.pin-b {
right: 24%;
top: 38%;
background: var(--teal);
box-shadow: 0 0 0 10px rgba(22,184,166,.14);
animation-delay: .4s
}

.pin-c {
left: 44%;
bottom: 22%;
background: var(--navy);
box-shadow: 0 0 0 10px rgba(14,42,71,.12);
animation-delay: .8s
}

.showcase-card {
position: absolute;
z-index: 3;
background: rgba(255,255,255,.92);
border: 1px solid rgba(230,237,245,.95);
border-radius: 22px;
padding: 16px 18px;
box-shadow: var(--shadow-md);
backdrop-filter: blur(14px)
}

.stay-card {
left: 42px;
top: 48px;
min-width: 260px
}

.showcase-card b, .showcase-card strong {
display: block;
color: var(--navy);
margin-bottom: 2px
}

.showcase-card small {
color: var(--muted);
font-weight: 700
}

.mini-label {
display: inline-flex;
margin-bottom: 8px;
padding: 5px 9px;
border-radius: 999px;
background: rgba(22,184,166,.12);
color: var(--teal-2);
font-size: 1.5rem;
font-weight: 900
}

.service-a {
right: 34px;
top: 170px
}

.service-b {
left: 58px;
bottom: 130px
}

.service-c {
right: 54px;
bottom: 58px
}
 @keyframes pulse {
 50% {
 transform: scale(1.2);
 box-shadow: 0 0 0 17px rgba(255,122,89,0)
}
}
 @keyframes spin {
 to {
 transform: rotate(360deg)
}
}

/* sections */
.section { padding: 40px 0; }

.muted-section {
background: rgba(246,248,251,.78);
border-block: 1px solid var(--line)
}

.section-heading { margin-bottom: 30px; }

.section-heading.centered {
text-align: center;
margin-inline: auto
}

.section-heading h2 {
font-size: clamp(2rem, 3.5vw, 3.4rem);
line-height: 1.05;
letter-spacing: -.055em;
color: var(--navy);
margin: 12px 0
}

.section-heading p {
color: var(--muted);
font-size: 1.08rem
}

.section-heading.split {
max-width: none;
display: flex;
align-items: end;
justify-content: space-between;
gap: 20px
}

.text-link {
color: var(--teal-2);
font-weight: 900
}

.how-redesign { background: #fff }

.process-board {
position: relative;
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 18px
}

.process-board:before {
content: "";
position: absolute;
left: 10%;
right: 10%;
top: 60px;
height: 2px;
background: linear-gradient(90deg, var(--coral), var(--teal));
opacity: .28
}

.process-step {
position: relative;
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
padding: 24px;
box-shadow: var(--shadow-sm);
transition: .25s var(--ease)
}

.process-step:hover, .category-card:hover, .listing-card:hover {
transform: translateY(-6px);
box-shadow: var(--shadow-md)
}

.process-number {
position: absolute;
right: 18px;
top: 18px;
font-size: .78rem;
font-weight: 950;
color: var(--muted);
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 999px;
padding: 5px 8px
}

.process-icon {
width: 58px;
height: 58px;
border-radius: 20px;
background: linear-gradient(135deg, rgba(255,122,89,.14), rgba(22,184,166,.14));
display: grid;
place-items: center;
font-size: 1.55rem;
margin-bottom: 18px
}

.process-step h3 {
font-size: 1.18rem;
color: var(--navy);
margin-bottom: 8px
}

.process-step p {
color: var(--muted);
font-size: .96rem
}

.story-card {
margin-top: 22px;
border-radius: 30px;
padding: 28px;
background: linear-gradient(135deg, var(--navy), #16466e);
color: white;
display: grid;
grid-template-columns: 1fr 1.1fr;
gap: 26px;
align-items: center;
box-shadow: var(--shadow-lg)
}

.story-card h3 {
font-size: 1.65rem;
margin: 8px 0;
color: white
}

.story-card p { color: rgba(255,255,255,.78) }

.story-flow {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap
}

.story-flow span {
background: rgba(255,255,255,.12);
border: 1px solid rgba(255,255,255,.16);
padding: 10px 12px;
border-radius: 999px;
font-weight: 900
}

.story-flow i {
width: 24px;
height: 2px;
background: var(--teal);
border-radius: 999px
}

.category-grid, .service-category-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px
}

.category-card, .service-category-card {
display: block;
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
padding: 25px;
box-shadow: var(--shadow-sm);
transition: .25s var(--ease)
}

.category-card span, .service-category-card .icon {
display: grid;
place-items: center;
width: 56px;
height: 56px;
border-radius: 18px;
background: var(--cream);
font-size: 1.5rem;
margin-bottom: 15px
}

.category-card h3, .service-category-card h3 {
color: var(--navy);
font-size: 1.12rem;
margin-bottom: 8px
}

.category-card p, .service-category-card p { color: var(--muted) }

.listing-grid, .cards-grid, .offers-grid, .requests-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px
}

.listing-card, .result-card, .offer-card, .request-card {
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
padding: 22px;
box-shadow: var(--shadow-sm);
transition: .25s var(--ease);
display: flex;
flex-direction: column;
min-height: 250px
}

.listing-top, .card-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-bottom: 14px
}

.listing-card h3, .result-card h3 {
font-size: 1.16rem;
color: var(--navy);
margin: 0 0 10px
}

.listing-card p, .result-card p {
color: var(--muted);
font-size: .96rem
}

.listing-meta, .card-meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: auto;
padding-top: 18px;
color: #526379;
font-size: .88rem
}

.listing-meta span, .card-meta span {
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 999px;
padding: 6px 9px
}

.listing-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 14px
}

.listing-footer strong { color: var(--navy) }

.badge {
display: inline-flex;
align-items: center;
gap: 5px;
border-radius: 999px;
padding: 6px 10px;
font-size: .75rem;
font-weight: 950;
line-height: 1
}

.badge-offer {
background: rgba(22,184,166,.12);
color: var(--teal-2)
}

.badge-request {
background: rgba(255,122,89,.13);
color: var(--coral-2)
}

.badge-featured, .badge-warning {
background: rgba(245,158,11,.14);
color: #a16207
}

.badge-soft, .badge-info {
background: #eef6ff;
color: #2563eb
}

.badge-success {
background: rgba(16,185,129,.13);
color: #047857
}

.badge-danger, .badge-error {
background: rgba(239,68,68,.12);
color: #b91c1c
}

.why-layout {
display: grid;
 grid-template-columns: .95fr 1.05fr;
gap: 30px;
align-items: center
}

.why-copy h2 {
font-size: clamp(2rem, 3.2vw, 3.2rem);
line-height: 1.05;
letter-spacing: -.05em;
color: var(--navy)
}

.why-copy p {
color: var(--muted);
font-size: 1.05rem
}

.feature-stack {
display: grid;
gap: 14px
}

.feature-stack div {
background: #fff;
border: 1px solid var(--line);
border-radius: 22px;
padding: 19px;
box-shadow: var(--shadow-sm);
display: grid;
gap: 3px
}

.feature-stack b { color: var(--navy) }

.feature-stack span { color: var(--muted) }

.cta-final { padding-top: 30px }

.cta-section { text-align: center; }

.cta-section small {
display: block;
text-align: center;
}

.cta-panel {
text-align: center;
border-radius: 38px;
padding: 64px 28px;
background: radial-gradient(circle at 20% 0, rgba(255,122,89,.35), transparent 35%), radial-gradient(circle at 80% 20%, rgba(22,184,166,.28), transparent 36%), linear-gradient(135deg, var(--navy), #12385f);
color: white;
box-shadow: var(--shadow-lg)
}

.cta-panel h2 {
font-size: clamp(2rem, 4vw, 4rem);
line-height: 1.02;
letter-spacing: -.06em;
color: white;
margin: 10px auto 12px;
max-width: 820px
}

.cta-panel p {
max-width: 680px;
margin: 0 auto 24px;
color: rgba(255,255,255,.78)
}

.cta-panel .eyebrow { color: #9ff3e8 }

.cta-panel .cta-buttons { justify-content: center }

/* generic pages */
.page-wrap, .dashboard-container>.container, .auth-container, .form-container, .profile-container { padding-block: 40px }

.page-header, .dashboard-header, .auth-header, .section-header {
background: transparent;
padding: 30px 0
}

.page-header h1, .dashboard-header h1, .auth-header h1 {
font-size: clamp(2rem, 4vw, 3.4rem);
line-height: 1.05;
letter-spacing: -.05em;
color: var(--navy);
margin-bottom: 10px
}

.page-header p, .dashboard-header p, .auth-header p { color: var(--muted) }

.grid, .dashboard-grid, .stats-grid {
display: grid;
gap: 18px
}

.stats-grid {
grid-template-columns: repeat(4, 1fr);
margin: 20px 0 26px
}

.stat-card, .dashboard-card, .content-card, .form-card, .auth-card, .filter-card, .profile-card, .conversation-item, .message-card, .pricing-card, .package-card, .empty-state, .table-container {
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
box-shadow: var(--shadow-sm);
padding: 22px;
text-align: center;
}

.stat-card {
display: flex;
align-items: center;
gap: 14px
}

.stat-icon {
width: 52px;
height: 52px;
border-radius: 18px;
background: linear-gradient(135deg, rgba(255,122,89,.13), rgba(22,184,166,.12));
display: grid;
place-items: center;
font-size: 1.45rem
}

.stat-content label, .stat-label {
display: block;
color: var(--muted);
font-weight: 800;
font-size: .86rem
}

.stat-number {
font-size: 1.7rem;
font-weight: 950;
color: var(--navy)
}

.dashboard-actions, .quick-actions, .action-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 14px
}

.action-card {
background: #fff;
border: 1px solid var(--line);
border-radius: 24px;
padding: 22px;
box-shadow: var(--shadow-sm);
transition: .25s var(--ease)
}

.action-card:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-md)
}

.action-card h3 {
color: var(--navy);
margin-bottom: 6px
}

.action-card p { color: var(--muted) }

/* forms */
.form-group { margin-bottom: 16px }

.form-group label, .form-label {
display: block;
font-weight: 900;
color: var(--navy);
margin-bottom: 7px
}

.form-control, input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=time], select, textarea {
width: 100%;
border: 1px solid var(--line);
background: #fff;
border-radius: 16px;
padding: 12px 14px;
outline: none;
color: var(--ink);
transition: .2s var(--ease)
}

textarea {
min-height: 120px;
resize: vertical
}

.form-control:focus, input:focus, select:focus, textarea:focus {
border-color: rgba(22,184,166,.7);
box-shadow: 0 0 0 4px rgba(22,184,166,.1)
}

.form-row {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 14px
}

.form-actions {
display: flex;
gap: 10px;
flex-wrap: wrap;
margin-top: 18px
}

.form-error, .error-message {
color: var(--danger);
font-size: .86rem;
font-weight: 800
}

.help-text, .form-help, .text-muted { color: var(--muted) }

.checkbox-label {
display: flex!important;
gap: 10px;
align-items: flex-start
}

.checkbox-label input {
width: auto;
margin-top: 4px
}

.auth-container {
min-height: calc(100vh - var(--header-h));
display: grid;
place-items: center
}

.auth-card {
width: min(100%, 520px);
padding: 32px
}

.auth-links {
text-align: center;
margin-top: 18px;
color: var(--muted)
}

.auth-links a {
color: var(--teal-2);
font-weight: 900
}

.alert {
padding: 13px 15px;
border-radius: 16px;
margin: 14px 0;
font-weight: 800;
border: 1px solid var(--line);
background: #fff
}

.alert-success {
background: #ecfdf5;
color: #047857;
border-color: #bbf7d0
}

.alert-error, .alert-danger {
background: #fef2f2;
color: #b91c1c;
border-color: #fecaca
}

.alert-warning {
background: #fffbeb;
color: #92400e;
border-color: #fde68a
}

.alert-info {
background: #eff6ff;
color: #1d4ed8;
border-color: #bfdbfe
}

/* explore/results */
.search-filters, .filters-section, .filter-bar {
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
padding: 18px;
box-shadow: var(--shadow-sm);
margin-bottom: 24px
}

.filter-form {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
align-items: end
}

.active-filters {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin: 12px 0
}

.filter-tag {
padding: 7px 10px;
background: #fff;
border: 1px solid var(--line);
border-radius: 999px;
color: var(--muted);
font-weight: 800
}

.results-header {
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
margin-bottom: 18px
}

.results-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px
}

.pagination {
display: flex;
justify-content: center;
gap: 8px;
margin-top: 28px
}

.pagination a, .pagination span {
padding: 9px 12px;
border-radius: 12px;
border: 1px solid var(--line);
font-weight: 800
}

.pagination .active {
background: var(--navy);
color: white
}

/* tables */
.table-container {
overflow: auto;
padding: 0
}

.table, .admin-table {
width: 100%;
border-collapse: collapse;
min-width: 760px
}

.table th, .table td, .admin-table th, .admin-table td {
padding: 14px 15px;
border-bottom: 1px solid var(--line);
text-align: left;
vertical-align: top
}

.table th, .admin-table th {
background: #f8fafc;
color: var(--navy);
font-size: .8rem;
text-transform: uppercase;
letter-spacing: .06em
}

.table tr:hover, .admin-table tr:hover { background: #fbfdff }

.inline-form {
display: inline-flex;
gap: 7px;
align-items: center
}

.inline-form select {
padding: 7px 10px;
border-radius: 12px
}

.avatar, .avatar-default {
width: 46px;
height: 46px;
border-radius: 50%;
object-fit: cover;
display: grid;
place-items: center;
background: linear-gradient(135deg, var(--coral), var(--teal));
color: #fff;
font-weight: 950
}

.avatar-large {
width: 96px;
height: 96px
}

.conversations-list {
display: grid;
gap: 12px
}

.conversation-item {
display: flex;
gap: 14px;
align-items: center;
transition: .22s var(--ease)
}

.conversation-item:hover {
transform: translateY(-2px);
box-shadow: var(--shadow-md)
}

.conversation-header {
display: flex;
gap: 10px;
align-items: center;
justify-content: space-between
}

.conversation-info { flex: 1 }

.conversation-preview {
color: var(--muted);
margin: 0
}

.messages-thread {
display: grid;
gap: 12px
}

.message {
max-width: 75%;
padding: 13px 15px;
border-radius: 18px;
background: #fff;
border: 1px solid var(--line);
box-shadow: var(--shadow-xs)
}

.message.sent {
justify-self: end;
background: var(--navy);
color: white
}

.message.received { justify-self: start }

.message small { opacity: .72 }

.message-form {
display: flex;
gap: 10px;
margin-top: 18px
}

.message-form textarea { min-height: 56px }

/* pricing */
.pricing-grid, .packages-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px
}

.pricing-card, .package-card {
position: relative;
display: flex;
flex-direction: column
}

.pricing-card.featured, .package-card.featured {
border-color: rgba(22,184,166,.55);
box-shadow: 0 22px 60px rgba(22,184,166,.15)
}

.price, .package-price {
font-size: 2rem;
font-weight: 950;
color: var(--navy);
margin: 12px 0
}

.pricing-card ul, .package-card ul {
display: grid;
gap: 9px;
margin: 14px 0 20px;
padding: 0;
list-style: none
}

/* footer */
.site-footer {
margin-top: 70px;
background: var(--navy);
color: white;
padding: 54px 0 22px
}

.footer-grid {
display: grid;
grid-template-columns: 1.6fr repeat(3, 1fr);
gap: 30px
}

.site-footer h3 {
font-size: .86rem;
text-transform: uppercase;
letter-spacing: .12em;
color: rgba(255,255,255,.6);
margin: 0 0 14px
}

.site-footer a {
display: block;
color: rgba(255,255,255,.78);
margin: 8px 0;
font-weight: 750
}

.site-footer a:hover { color: #fff }

.footer-brand-block p {
color: rgba(255,255,255,.7);
max-width: 320px
}

.brand-footer .brand-mark {
background: rgba(255,255,255,.1);
border-color: rgba(255,255,255,.16);
color: white
}

.brand-footer .brand-word em { color: white }

.footer-bottom {
border-top: 1px solid rgba(255,255,255,.12);
margin-top: 28px;
padding-top: 18px;
display: flex;
justify-content: space-between;
gap: 12px;
color: rgba(255,255,255,.58);
font-size: .9rem
}

/* animation */
.reveal {
opacity: 0;
transform: translateY(18px);
transition: opacity .65s var(--ease), transform .65s var(--ease)
}

.reveal.is-visible {
opacity: 1;
transform: translateY(0)
}

/* responsive */
@media (max-width: 1100px) {

.hero-grid { grid-template-columns: 1fr }

.hero-showcase { min-height: 460px }

.showcase-map { height: 460px }

.process-board, .pricing-grid, .packages-grid { grid-template-columns: repeat(2, 1fr) }

.listing-grid, .results-grid, .category-grid, .service-category-grid { grid-template-columns: repeat(2, 1fr) }

.stats-grid { grid-template-columns: repeat(2, 1fr) }

.filter-form { grid-template-columns: repeat(2, 1fr) }
}

@media (max-width: 900px) {

:root { --header-h:68px
}

.nav-toggle { display: block }

.nav-shell { gap: 12px }

.nav-menu {
position: fixed;
left: 16px;
right: 16px;
top: 76px;
display: grid;
gap: 6px;
margin: 0;
background: white;
border: 1px solid var(--line);
border-radius: 24px;
padding: 14px;
box-shadow: var(--shadow-lg);
opacity: 0;
pointer-events: none;
transform: translateY(-10px);
transition: .22s var(--ease)
}

.nav-menu.nav-open {
opacity: 1;
pointer-events: auto;
transform: translateY(0)
}

.nav-link { display: block }

.nav-actions { margin-left: auto }

.nav-actions .btn-ghost { display: none }

.brand-word { font-size: 1.24rem }

.hero-search-card { grid-template-columns: 1fr }

.story-card, .why-layout { grid-template-columns: 1fr }

.footer-grid { grid-template-columns: 1fr 1fr }

.hero-redesign { padding-top: 54px }

.hero-showcase { display: none }
}

@media (max-width: 640px) {

.container { width: min(100% - 22px, var(--container)) }

.nav-actions .language-pill, .nav-actions .icon-btn { display: none }

.brand-mark {
width: 40px;
height: 40px
}

.hero-content h1 { font-size: 2.7rem }

.hero-actions .btn, .cta-buttons .btn { width: 100% }

.section { padding: 58px 0 }

.process-board, .listing-grid, .results-grid, .category-grid, .service-category-grid, .stats-grid, .dashboard-actions, .quick-actions, .action-grid, .pricing-grid, .packages-grid, .filter-form, .form-row { grid-template-columns: 1fr }

.process-board:before { display: none }

.story-flow {
display: grid;
grid-template-columns: 1fr
}

.story-flow i { display: none }

.section-heading.split, .results-header, .footer-bottom { display: block }

.footer-grid { grid-template-columns: 1fr }

.message { max-width: 92% }

.message-form { display: grid }

.table, .admin-table { min-width: 650px }
}

@media (prefers-reduced-motion:reduce) {

*, *:before, *:after {
animation: none!important;
transition: none!important;
scroll-behavior: auto!important
}

.reveal {
opacity: 1;
transform: none
}
}

/* =====================================================================
   LobbiLink final container/logo/interactive redesign pass
   ===================================================================== */
:root { --container: 1180px;
 --container-wide: 1280px;
 --gutter: 24px;
}

.container, .explore-container, .dashboard-container, .auth-container, .password-reset-container, .profile-container {
 width: min(calc(100% - (var(--gutter) * 2)), var(--container));
margin-left: auto;
margin-right: auto;
}

.explore-container {
max-width: var(--container);
padding: 42px 0 72px;
display: grid;
grid-template-columns: 320px minmax(0, 1fr);
gap: 24px;
align-items: start;
}

.explore-sidebar, .results-main, .results-content, .explore-results { min-width: 0; }

.explore-sidebar {
position: sticky;
top: calc(var(--header-h) + 18px);
background: rgba(255,255,255,.88);
border: 1px solid rgba(230,237,245,.95);
border-radius: 28px;
box-shadow: var(--shadow-sm);
padding: 22px;
backdrop-filter: blur(14px);
}

.explore-sidebar h3 {
color: var(--navy);
font-size: 1.2rem;
margin: 0 0 16px;
letter-spacing: -.025em
}

.explore-sidebar .filter-form {
display: grid;
grid-template-columns: 1fr;
gap: 14px
}

.filter-group { min-width: 0 }

.filter-label {
display: block;
margin-bottom: 7px;
font-size: .78rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .08em;
color: var(--muted)
}

.explore-main, .results-area { min-width: 0 }

.results-header {
display: flex;
align-items: end;
justify-content: space-between;
gap: 20px;
margin-bottom: 18px
}

.results-header h1 {
font-size: clamp(2rem, 4vw, 3.5rem);
line-height: 1.02;
letter-spacing: -.06em;
color: var(--navy);
margin: 0
}

.results-header p, .results-count {
color: var(--muted);
font-weight: 700
}

.active-filters {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: 0 0 18px
}

.filter-chip {
display: inline-flex;
gap: 6px;
align-items: center;
border: 1px solid var(--line);
background: #fff;
border-radius: 999px;
padding: 7px 11px;
font-size: .84rem;
font-weight: 850;
color: #53657c
}

.results-grid, .listing-grid, .offers-grid, .requests-grid, .stays-grid, .messages-grid, .favourites-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px
}

.result-card, .listing-card, .offer-card, .request-card, .stay-card-item, .message-card, .favourite-card {
background: #fff;
border: 1px solid rgba(230,237,245,.98);
border-radius: 26px;
padding: 22px;
box-shadow: var(--shadow-sm);
min-width: 0;
transition: .22s var(--ease)
}

.result-card:hover, .offer-card:hover, .request-card:hover, .stay-card-item:hover, .message-card:hover, .favourite-card:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-md)
}

.card-meta, .listing-meta, .result-meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
color: var(--muted);
font-weight: 750;
font-size: .9rem
}

.card-actions, .listing-footer, .result-footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-top: 18px;
flex-wrap: wrap
}

/* Real logo assets */
.brand { min-width: 0 }

.brand-logo-img {
width: clamp(170px, 18vw, 238px);
height: auto;
object-fit: contain
}

.site-header .brand-logo-img { max-height: 58px }

.brand-mark, .brand-word { display: none!important }

.footer-logo-img {
width: 230px;
max-width: 100%;
filter: none
}

.footer-brand-block p { margin-top: 12px }

.site-footer {
background: linear-gradient(180deg, #071c31, #0E2A47);
color: #dce7f4;
padding: 62px 0 28px
}

.site-footer .footer-grid {
display: grid;
 grid-template-columns: minmax(280px, 1.4fr) repeat(3, minmax(160px, .6fr));
gap: 30px
}

.site-footer h3 {
color: #fff;
margin-bottom: 13px
}

.site-footer a {
display: block;
color: #c8d6e5;
margin: 8px 0;
font-weight: 750
}

.site-footer a:hover { color: #fff }

.footer-bottom {
margin-top: 34px;
padding-top: 20px;
border-top: 1px solid rgba(255,255,255,.12);
display: flex;
justify-content: space-between;
gap: 18px;
color: #a9bbcf
}

/* Stronger modern header */
.site-header.is-scrolled {
background: rgba(255,255,255,.84);
box-shadow: 0 14px 38px rgba(14,42,71,.08)
}

.nav-shell {
max-width: var(--container);
margin-inline: auto
}

.nav-actions { flex-shrink: 0 }

.nav-link { font-size: .92rem }

.language-pill { flex-shrink: 0 }

/* Interactive How it works */
.how-lab-section {
position: relative;
background: linear-gradient(180deg, #fff 0%, #f8fbfc 100%);
overflow: hidden
}

.interactive-how {
position: relative;
display: grid;
 grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr);
gap: 24px;
align-items: stretch;
margin-top: 34px
}

.how-stage {
position: relative;
min-height: 540px;
border: 1px solid rgba(230,237,245,.95);
border-radius: 38px;
background: linear-gradient(145deg, #ffffff, #fff7ef 45%, #eafdfa);
box-shadow: var(--shadow-lg);
overflow: hidden
}

.how-map-grid {
position: absolute;
inset: 0;
background-image: linear-gradient(rgba(14,42,71,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(14,42,71,.06) 1px, transparent 1px);
background-size: 44px 44px;
mask-image: radial-gradient(circle at center, #000 20%, transparent 86%);
opacity: .78
}

.stay-orbit {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
border: 2px dashed rgba(22,184,166,.34);
border-radius: 999px
}

.orbit-one {
width: 48%;
height: 48%;
animation: spin 32s linear infinite
}

.orbit-two {
width: 74%;
height: 74%;
animation: spin 52s linear infinite reverse;
border-color: rgba(255,122,89,.28)
}

.stay-hub {
position: absolute;
left: 50%;
top: 50%;
width: 170px;
min-height: 170px;
transform: translate(-50%, -50%);
display: grid;
place-items: center;
text-align: center;
padding: 18px;
background: rgba(255,255,255,.9);
border: 1px solid rgba(230,237,245,.95);
border-radius: 34px;
box-shadow: var(--shadow-md);
z-index: 4
}

.stay-hub img {
width: 86px;
height: 86px;
object-fit: contain
}

.stay-hub strong {
display: block;
color: var(--navy);
font-size: 1.08rem;
line-height: 1.1
}

.stay-hub small {
display: block;
color: var(--muted);
font-weight: 750
}

.how-lines {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 1;
pointer-events: none
}

.how-lines path {
fill: none;
stroke: rgba(14,42,71,.16);
stroke-width: 3;
stroke-linecap: round;
stroke-dasharray: 8 10;
animation: dashMove 14s linear infinite
}

.how-node {
position: absolute;
z-index: 5;
border: 0;
background: #fff;
border: 1px solid rgba(230,237,245,.95);
border-radius: 22px;
padding: 12px 14px;
display: flex;
align-items: center;
gap: 9px;
box-shadow: var(--shadow-sm);
font-weight: 950;
color: var(--navy);
transition: .22s var(--ease)
}

.how-node:hover, .how-node.is-active {
transform: translateY(-4px) scale(1.03);
box-shadow: var(--shadow-md)
}

.how-node.is-active {
background: var(--navy);
color: #fff
}

.how-node span {
display: grid;
place-items: center;
width: 34px;
height: 34px;
border-radius: 14px;
background: rgba(22,184,166,.13)
}

.node-stay {
left: 8%;
top: 10%
}

.node-offer {
right: 13%;
top: 13%;
}

.node-discover {
left: 10%;
bottom: 54%;
}

.node-chat {
left: 67%;
bottom: 61%;
}

.node-trust {
left: 74%;
top: 78%;
transform: translateX(-50%)
}

.node-trust:hover, .node-trust.is-active { transform: translateX(-50%) translateY(-4px) scale(1.03) }

.floating-service {
position: absolute;
z-index: 3;
background: rgba(255,255,255,.85);
border: 1px solid rgba(230,237,245,.92);
border-radius: 18px;
padding: 10px 12px;
color: var(--navy);
font-weight: 900;
box-shadow: var(--shadow-sm);
backdrop-filter: blur(10px);
animation: floaty 5s ease-in-out infinite
}

.floating-service small {
color: var(--muted);
font-weight: 750
}

.card-photo {
left: 8%;
top: 54%;
}

.card-yoga {
right: 12%;
top: 47%;
animation-delay: .8s
}

.card-help {
left: 18%;
bottom: 13%;
animation-delay: 1.4s
}

.how-control-panel {
background: rgba(255,255,255,.92);
border: 1px solid rgba(230,237,245,.95);
border-radius: 38px;
padding: 26px;
box-shadow: var(--shadow-md);
display: flex;
flex-direction: column;
justify-content: space-between
}

.how-progress {
height: 9px;
background: #eef3f8;
border-radius: 999px;
overflow: hidden;
margin-bottom: 20px
}

.how-progress span {
display: block;
height: 100%;
background: linear-gradient(90deg, var(--coral), var(--teal));
border-radius: inherit;
transition: width .35s var(--ease)
}

.how-step-copy { display: none }

.how-step-copy.is-active {
display: block;
animation: fadeSlide .32s var(--ease)
}

.how-step-copy h3 {
font-size: clamp(1.55rem, 2.5vw, 2.25rem);
line-height: 1.08;
letter-spacing: -.045em;
color: var(--navy);
margin: 12px 0
}

.how-step-copy p {
color: var(--muted);
font-size: 1.02rem
}

.how-step-copy ul {
padding-left: 18px;
color: #4c5f76;
font-weight: 700
}

.how-step-copy li { margin: 8px 0 }

.how-controls {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 8px;
margin-top: 24px
}

.how-controls button {
border: 1px solid var(--line);
background: #fff;
border-radius: 999px;
padding: 9px 8px;
font-size: .82rem;
font-weight: 950;
color: #53657c
}

.how-controls button.is-active {
background: var(--navy);
color: #fff;
border-color: var(--navy)
}

.scenario-lane {
margin-top: 24px;
display: grid;
 grid-template-columns: minmax(240px, .85fr) minmax(0, 1.6fr);
gap: 20px;
background: #0E2A47;
color: #fff;
border-radius: 34px;
padding: 24px;
box-shadow: var(--shadow-lg);
overflow: hidden
}

.scenario-intro h3 {
font-size: 1.55rem;
line-height: 1.1;
letter-spacing: -.04em
}

.scenario-intro p { color: #c9d6e5 }

.scenario-steps {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 12px;
align-items: stretch
}

.scenario-steps div {
position: relative;
background: rgba(255,255,255,.1);
border: 1px solid rgba(255,255,255,.14);
border-radius: 20px;
padding: 15px
}

.scenario-steps span {
display: grid;
place-items: center;
width: 34px;
height: 34px;
border-radius: 50%;
background: linear-gradient(135deg, var(--coral), var(--teal));
font-weight: 950;
margin-bottom: 12px
}

.scenario-steps b { display: block }

.scenario-steps small {
color: #cbd8e8;
font-weight: 700
}
 @keyframes dashMove {
 to {
 stroke-dashoffset: -180
}
}
 @keyframes floaty {
 50% {
 transform: translateY(-10px)
}
}
 @keyframes fadeSlide {
 from {
 opacity: 0;
 transform: translateY(10px)
}
 to {
 opacity: 1;
 transform: none
}
}

/* General layout fixes for legacy pages */
.page-wrap { padding-block: 48px }

.form-container, .profile-form-container, .auth-card, .content-card, .legal-content, .safety-content, .contact-content, .password-reset-card {
background: #fff;
border: 1px solid var(--line);
border-radius: 28px;
box-shadow: var(--shadow-sm);
padding: clamp(22px, 3vw, 34px)
}

.page-header { padding: 50px 0 24px }

.page-header h1 {
font-size: clamp(2rem, 4.5vw, 3.75rem);
letter-spacing: -.06em;
line-height: 1.02;
color: var(--navy);
margin-bottom: 10px
}

.page-header p {
color: var(--muted);
font-size: 1.05rem
}

.dashboard-container {
max-width: var(--container);
padding: 40px 0 72px
}

.dashboard-grid, .stats-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px
}

.dashboard-card, .stat-card {
background: #fff;
border: 1px solid var(--line);
border-radius: 24px;
padding: 22px;
box-shadow: var(--shadow-sm)
}

/* Responsive */
@media(max-width: 1120px) {

.interactive-how { grid-template-columns: 1fr }

.how-stage { min-height: 500px }

.explore-container { grid-template-columns: 1fr }

.explore-sidebar {
position: relative;
top: auto
}

.explore-sidebar .filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)) }

.site-footer .footer-grid { grid-template-columns: 1fr 1fr }

.dashboard-grid, .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) }
}

@media(max-width: 820px) {

:root { --gutter:18px
}

.brand-logo-img {
width: 188px;
margin: 0 auto;
}

.site-header .brand-logo-img { max-height: 48px }

.results-grid, .listing-grid, .offers-grid, .requests-grid, .stays-grid, .messages-grid, .favourites-grid { grid-template-columns: 1fr }

.scenario-lane { grid-template-columns: 1fr }

.scenario-steps { grid-template-columns: 1fr }

.how-controls { grid-template-columns: repeat(3, 1fr) }

.how-stage { min-height: 620px }

.node-stay {
left: 5%;
top: 6%
}

.node-offer {
right: 5%;
top: 22%
}

.node-discover { /* right: 5%; */ /* bottom: 20%; */ }

.node-chat {
left: 5%;
bottom: 16%
}

.node-trust {
top: 47%;
left: 8%;
transform: none
}

.node-trust:hover, .node-trust.is-active { transform: translateY(-4px) scale(1.03) }

.floating-service { display: none }

.footer-bottom { display: block }

.site-footer .footer-grid { grid-template-columns: 1fr }
}

@media(max-width: 560px) {

.container, .explore-container, .dashboard-container, .auth-container, .password-reset-container, .profile-container { width: min(calc(100% - 28px), var(--container)) }

.explore-sidebar .filter-form { grid-template-columns: 1fr }

.how-stage {
min-height: 560px;
border-radius: 28px
}

.stay-hub {
width: 142px;
min-height: 142px
}

.stay-hub img {
width: 68px;
height: 68px
}

.how-node {
font-size: .78rem;
padding: 9px 10px
}

.how-node span {
width: 28px;
height: 28px
}

.node-offer { top: 14%; }

.node-discover {
bottom: 70%;
left: 14%;
}

.node-chat { bottom: 16%; }

.node-trust {
top: 80%;
left: 64%;
}

.how-control-panel {
border-radius: 28px;
padding: 20px
}

.how-controls { grid-template-columns: 1fr 1fr }

.dashboard-grid, .stats-grid { grid-template-columns: 1fr }

.hero-search-card { grid-template-columns: 1fr }

.hero-search-card button { width: 100% }
}

@media(prefers-reduced-motion:reduce) {

*, *:before, *:after {
animation: none!important;
transition: none!important;
scroll-behavior: auto!important
}
}

/* === Final polish: flat icons, mobile language, dashboard redesign === */
.flat-icon, .nav-svg-icon, .btn-icon, .action-icon, .empty-icon {
display: inline-block;
width: 1.15em;
height: 1.15em;
vertical-align: -.18em;
flex: 0 0 auto
}

.nav-svg-icon {
width: 20px;
height: 20px;
color: var(--navy)
}

.btn-icon {
width: 16px;
height: 16px
}

.action-icon {
width: 18px;
height: 18px
}

.empty-icon {
width: 48px;
height: 48px;
color: var(--teal);
margin-bottom: 10px
}

.mobile-language-pill { display: none }

.icon-btn { color: var(--navy) }

.dashboard-hero { padding: 58px 0 24px }

.dashboard-hero-grid {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(280px, 390px);
gap: 28px;
align-items: end
}

.dashboard-hero h1 {
font-size: clamp(2.3rem, 4vw, 3rem);
letter-spacing: -.075em;
line-height: .98;
color: var(--navy);
margin: 8px 0 12px
}

.dashboard-hero p {
font-size: 1.07rem;
color: var(--muted);
max-width: 720px
}

.dashboard-profile-card {
display: flex;
align-items: center;
gap: 14px;
background: rgba(255,255,255,.86);
border: 1px solid var(--line);
border-radius: 28px;
padding: 14px;
box-shadow: var(--shadow-sm);
backdrop-filter: blur(14px)
}

.profile-avatar-mini {
width: 58px;
height: 58px;
border-radius: 20px;
overflow: hidden;
background: #fff;
border: 1px solid var(--line);
flex: 0 0 auto
}

.profile-avatar-mini img {
width: 100%;
height: 100%;
object-fit: cover
}

.dashboard-profile-card strong {
display: block;
color: var(--navy);
font-weight: 950;
line-height: 1.15
}

.dashboard-profile-card span {
display: block;
color: var(--muted);
font-weight: 800;
font-size: .9rem
}

.dashboard-profile-info {
min-width: 0;
flex: 1
}

.dashboard-requested-package {
display: block;
margin-top: 4px;
color: rgb(255 110 77);
font-weight: 900;
font-size: .82rem;
line-height: 1.25
}

.dashboard-profile-actions {
margin-left: auto;
display: grid;
gap: 8px;
align-items: stretch
}

.dashboard-profile-actions .btn {
margin-left: 0;
width: 100%
}

.dashboard-modern { padding-bottom: 76px }

.dashboard-stats-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px;
margin: 18px 0 22px
}

.dashboard-stat-card {
position: relative;
overflow: hidden;
background: #fff;
border: 1px solid var(--line);
border-radius: 28px;
padding: 22px;
display: flex;
gap: 16px;
align-items: center;
box-shadow: var(--shadow-sm);
transition: .22s var(--ease)
}

.dashboard-stat-card:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-md)
}

.dashboard-stat-card:after {
content: "";
position: absolute;
right: -30px;
top: -30px;
width: 110px;
height: 110px;
border-radius: 50%;
background: currentColor;
opacity: .08
}

.stat-icon-modern {
width: 58px;
height: 58px;
border-radius: 20px;
display: grid;
place-items: center;
color: #fff;
box-shadow: 0 16px 32px rgba(14,42,71,.12);
flex: 0 0 auto
}

.stat-icon-modern .flat-icon {
width: 27px;
height: 27px
}

.stat-coral .stat-icon-modern { background: linear-gradient(135deg, var(--coral), #ff5d3b) }

.stat-teal .stat-icon-modern { background: linear-gradient(135deg, var(--teal), #0d9488) }

.stat-navy .stat-icon-modern { background: linear-gradient(135deg, var(--navy), #17456f) }

.stat-blue .stat-icon-modern { background: linear-gradient(135deg, #3b82f6, #16B8A6) }

.dashboard-stat-card span {
display: block;
color: var(--muted);
font-weight: 900;
font-size: .92rem
}

.dashboard-stat-card strong {
display: block;
color: var(--navy);
font-size: 2.15rem;
line-height: 1;
font-weight: 950;
letter-spacing: -.04em;
margin-top: 5px
}

.dashboard-action-panel {
display: grid;
 grid-template-columns: minmax(240px, .75fr) minmax(0, 1.35fr);
gap: 22px;
align-items: stretch;
background: linear-gradient(135deg, #fff, rgba(22,184,166,.07));
border: 1px solid var(--line);
border-radius: 34px;
box-shadow: var(--shadow-md);
padding: clamp(22px, 3vw, 32px);
margin: 22px 0
}

.dashboard-action-panel h2 {
font-size: clamp(1.7rem, 3vw, 2.55rem);
letter-spacing: -.06em;
line-height: 1.05;
color: var(--navy);
margin: 8px 0 10px
}

.dashboard-action-panel p {
color: var(--muted);
font-weight: 700
}

.dashboard-action-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)) !important;
gap: 13px
}

.action-tile {
position: relative;
display: flex;
flex-direction: column;
gap: 10px;
min-height: 156px;
padding: 18px;
border-radius: 24px;
background: #fff;
border: 1px solid var(--line);
box-shadow: var(--shadow-xs);
transition: .22s var(--ease);
overflow: hidden
}

.action-tile:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-sm);
border-color: rgba(22,184,166,.45)
}

.action-tile span {
width: 46px;
height: 46px;
border-radius: 18px;
display: grid;
place-items: center;
background: rgba(22,184,166,.12);
color: var(--teal)
}

.action-tile:nth-child(2) span {
background: rgba(255,122,89,.13);
color: var(--coral)
}

.action-tile:nth-child(3) span {
background: rgba(14,42,71,.1);
color: var(--navy)
}

.action-tile:nth-child(4) span {
background: rgba(59,130,246,.11);
color: #2563eb
}

.action-tile .flat-icon {
width: 24px;
height: 24px
}

.action-tile strong {
color: var(--navy);
font-size: 1.02rem;
font-weight: 950;
line-height: 1.1
}

.action-tile small {
color: var(--muted);
font-weight: 750;
line-height: 1.35
}

.dashboard-content-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px;
margin-top: 22px
}

.dashboard-panel {
background: rgba(255,255,255,.94);
border: 1px solid var(--line);
border-radius: 30px;
box-shadow: var(--shadow-sm);
padding: 22px;
min-width: 0
}

.dashboard-panel-wide { grid-column: span 2 }

.panel-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 15px
}

.panel-head h2 {
margin: 0;
color: var(--navy);
font-size: 1.25rem;
letter-spacing: -.035em
}

.panel-head a {
color: var(--teal-2);
font-weight: 950;
font-size: .92rem
}

.modern-list {
display: grid;
gap: 11px
}

.modern-list-item {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto auto;
gap: 12px;
align-items: center;
padding: 13px;
border: 1px solid var(--line);
border-radius: 20px;
background: #fff;
transition: .2s
}

.modern-list-item:hover {
transform: translateY(-2px);
box-shadow: var(--shadow-xs)
}

.modern-list-item.is-unread {
border-color: rgba(255,122,89,.45);
background: linear-gradient(90deg, rgba(255,122,89,.07), #fff)
}

.list-icon {
width: 42px;
height: 42px;
border-radius: 16px;
display: grid;
place-items: center;
background: rgba(22,184,166,.12);
color: var(--teal)
}

.list-icon .flat-icon {
width: 22px;
height: 22px
}

.modern-list-item h3 {
margin: 0 0 3px;
color: var(--navy);
font-size: 1rem;
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.modern-list-item p {
margin: 0;
color: var(--muted);
font-weight: 750;
font-size: .88rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.item-actions {
display: flex;
align-items: center;
gap: 7px
}

.item-actions a {
width: 36px;
height: 36px;
border-radius: 14px;
display: grid;
place-items: center;
background: #f8fafc;
border: 1px solid var(--line);
color: var(--navy)
}

.item-actions a:hover {
background: var(--navy);
color: #fff
}

.empty-state-modern {
text-align: center;
border: 1px dashed rgba(14,42,71,.18);
border-radius: 22px;
padding: 24px;
background: linear-gradient(180deg, #fff, #fbfdff)
}

.empty-state-modern h3 {
margin: 0 0 6px;
color: var(--navy);
letter-spacing: -.03em
}

.empty-state-modern p {
margin: 0 0 16px;
color: var(--muted);
font-weight: 700
}

.empty-state-modern.slim { padding: 18px }

.package-summary-modern {
display: flex;
align-items: center;
gap: 14px;
background: linear-gradient(135deg, rgba(14,42,71,.06), rgba(22,184,166,.08));
border: 1px solid var(--line);
border-radius: 22px;
padding: 16px
}

.package-summary-modern > span {
width: 48px;
height: 48px;
border-radius: 18px;
display: grid;
place-items: center;
background: var(--navy);
color: #fff;
flex: 0 0 auto
}

.package-summary-modern strong {
display: block;
color: var(--navy);
font-weight: 950
}

.package-summary-modern p {
margin: 3px 0 0;
color: var(--muted);
font-weight: 750
}

.package-summary-modern em {
margin-left: auto;
font-style: normal;
padding: 6px 10px;
border-radius: 999px;
background: rgba(16,185,129,.13);
color: #047857;
font-weight: 950
}

.status-badge.status-open, .status-badge.status-active {
background: rgba(16,185,129,.13);
color: #047857
}

.status-badge.status-paused, .status-badge.status-inactive, .status-badge.status-expired {
background: rgba(245,158,11,.14);
color: #a16207
}

.status-badge.status-closed, .status-badge.status-deleted {
background: rgba(239,68,68,.12);
color: #b91c1c
}

@media(max-width: 1120px) {

.dashboard-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) }

.dashboard-action-panel { grid-template-columns: 1fr }

.dashboard-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) }
}

@media(max-width: 820px) {

.dashboard-hero-grid { grid-template-columns: 1fr }

.dashboard-profile-card { align-items: center }

.mobile-language-pill {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-top: 8px;
padding: 10px 12px;
border-radius: 18px;
background: #f8fafc;
border: 1px solid var(--line)
}

.mobile-language-pill span {
color: var(--muted);
font-weight: 900
}

.mobile-language-pill a {
padding: 7px 10px;
border-radius: 999px;
background: #fff;
border: 1px solid var(--line);
font-weight: 950;
color: var(--navy)
}

.mobile-language-pill a.active {
background: var(--navy);
color: #fff;
border-color: var(--navy)
}
}

@media(max-width: 640px) {

.nav-actions .language-pill { display: none }

.nav-actions .icon-btn { display: grid }

.dashboard-stats-grid, .dashboard-action-grid, .dashboard-content-grid { grid-template-columns: 1fr }

.dashboard-panel-wide { grid-column: auto }

.dashboard-profile-card {
display: grid;
grid-template-columns: auto 1fr;
gap: 12px;
grid-auto-flow: column;
}

.dashboard-profile-card .btn {
grid-column: 1 / -1;
margin-left: 0;
width: 100%
}

.modern-list-item {
grid-template-columns: auto minmax(0, 1fr);
align-items: start
}

.modern-list-item .status-badge { justify-self: start }

.item-actions {
grid-column: 2;
justify-self: start
}

.dashboard-action-panel { border-radius: 28px }

.dashboard-panel {
border-radius: 24px;
padding: 18px
}
}

.inline-icon {
display: inline-block;
width: 1.05em;
height: 1.05em;
vertical-align: -.16em;
flex: 0 0 auto;
color: currentColor
}

.category-card .inline-icon, .empty-state-icon .inline-icon {
width: 34px;
height: 34px
}

.how-node .inline-icon, .floating-service .inline-icon {
width: 20px;
height: 20px
}

.meta-location .inline-icon, .location-icon .inline-icon, .date-icon .inline-icon, .views-icon .inline-icon {
width: 16px;
height: 16px;
margin-right: 4px
}

.pricing-card li .inline-icon, .package-card li .inline-icon {
width: 16px;
height: 16px;
color: var(--teal);
margin-right: 8px
}

.favourite-btn .inline-icon, .report-btn .inline-icon {
width: 16px;
height: 16px;
margin-right: 6px
}

/* === Detail pages + messaging polish patch === */
.detail-page-wrap, .messages-modern-wrap, .conversation-modern-wrap { padding-block: 42px 76px }

.detail-breadcrumbs {
display: flex;
align-items: center;
gap: 9px;
flex-wrap: wrap;
color: var(--muted);
font-weight: 800;
font-size: .9rem;
margin-bottom: 18px
}

.detail-breadcrumbs a { color: var(--teal-2) }

.detail-breadcrumbs strong {
color: var(--navy);
font-weight: 950
}

.detail-hero-card {
position: relative;
overflow: hidden;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(290px, 360px);
gap: 24px;
align-items: stretch;
background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(22,184,166,.08));
border: 1px solid var(--line);
border-radius: 38px;
box-shadow: var(--shadow-md);
padding: clamp(24px, 4vw, 42px);
margin-bottom: 24px
}

.detail-hero-card:before {
content: "";
position: absolute;
right: -110px;
top: -140px;
width: 360px;
height: 360px;
border-radius: 50%;
background: radial-gradient(circle, rgba(255,122,89,.18), transparent 68%);
pointer-events: none
}

.detail-hero-main {
position: relative;
z-index: 1;
min-width: 0
}

.detail-kicker-row {
display: flex;
gap: 9px;
align-items: center;
flex-wrap: wrap;
margin-bottom: 15px
}

.detail-pill, .status-badge, .badge {
display: inline-flex;
align-items: center;
gap: 6px;
border-radius: 999px;
padding: 7px 11px;
font-size: .78rem;
line-height: 1;
font-weight: 950;
border: 1px solid transparent
}

.detail-pill {
background: #fff;
border-color: var(--line);
color: var(--navy)
}

.detail-hero-main h1 {
font-size: clamp(2.15rem, 5vw, 4.4rem);
line-height: .98;
letter-spacing: -.07em;
color: var(--navy);
margin: 0 0 14px
}

.detail-lead {
max-width: 790px;
color: #53657c;
font-size: 1.08rem;
font-weight: 650;
margin-bottom: 20px
}

.detail-meta-strip {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin: 18px 0 24px
}

.detail-meta-strip span {
display: inline-flex;
align-items: center;
gap: 6px;
background: #fff;
border: 1px solid var(--line);
border-radius: 999px;
padding: 9px 12px;
color: #52647a;
font-size: .9rem;
font-weight: 850;
box-shadow: var(--shadow-xs)
}

.detail-actions-row {
display: flex;
gap: 11px;
flex-wrap: wrap
}

.detail-side-card {
position: relative;
z-index: 1;
background: var(--navy);
color: #fff;
border-radius: 30px;
padding: 24px;
box-shadow: var(--shadow-md);
align-self: stretch;
display: flex;
flex-direction: column;
justify-content: center;
min-height: 260px
}

.detail-side-card .side-label {
color: rgba(255,255,255,.72);
font-weight: 950;
text-transform: uppercase;
letter-spacing: .11em;
font-size: .75rem
}

.detail-side-card strong {
display: block;
font-size: clamp(2rem, 4vw, 3.2rem);
line-height: 1;
letter-spacing: -.055em;
margin: 8px 0;
color: #fff
}

.detail-side-card small {
color: rgba(255,255,255,.72);
font-weight: 800
}

.side-divider {
height: 1px;
background: rgba(255,255,255,.16);
margin: 18px 0
}

.side-stat-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
padding: 8px 0;
color: rgba(255,255,255,.78);
font-weight: 800
}

.side-stat-row b { color: #fff }

.detail-grid-v2 {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
gap: 22px;
align-items: start
}

.detail-content-card, .profile-mini-card, .stay-mini-card {
background: rgba(255,255,255,.94);
border: 1px solid var(--line);
border-radius: 30px;
box-shadow: var(--shadow-sm);
padding: 24px
}

.section-heading.mini { margin-bottom: 18px }

.section-heading.mini h2 { font-size: clamp(1.7rem, 3vw, 2.5rem) }

.detail-description-box {
font-size: 1.04rem;
color: #2d3a4e;
margin-bottom: 22px
}

.detail-description-box a {
color: var(--teal-2);
font-weight: 900
}

.info-tile-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 13px
}

.info-tile {
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 22px;
padding: 16px;
min-width: 0
}

.info-tile>span {
width: 42px;
height: 42px;
border-radius: 16px;
display: grid;
place-items: center;
background: rgba(22,184,166,.12);
color: var(--teal);
margin-bottom: 11px
}

.info-tile label {
display: block;
color: var(--muted);
font-size: .78rem;
text-transform: uppercase;
letter-spacing: .08em;
font-weight: 950
}

.info-tile strong {
display: block;
color: var(--navy);
font-size: 1rem;
line-height: 1.25;
margin-top: 4px
}

.detail-sidebar-v2 {
display: grid;
gap: 16px
}

.profile-mini-head {
display: flex;
gap: 13px;
align-items: center
}

.profile-mini-head img {
width: 64px;
height: 64px;
border-radius: 22px;
object-fit: cover;
border: 1px solid var(--line);
background: #fff
}

.profile-mini-head h3 {
margin: 0;
color: var(--navy);
font-size: 1.2rem;
letter-spacing: -.03em
}

.profile-mini-head p, .profile-mini-bio, .stay-mini-card p, .stay-mini-card small {
margin: 4px 0 0;
color: var(--muted);
font-weight: 750
}

.profile-mini-actions {
display: flex;
gap: 9px;
flex-wrap: wrap;
margin-top: 16px
}

.stay-mini-card {
display: flex;
gap: 13px
}

.stay-mini-card>span {
width: 48px;
height: 48px;
border-radius: 18px;
display: grid;
place-items: center;
background: linear-gradient(135deg, rgba(255,122,89,.16), rgba(22,184,166,.14));
color: var(--teal);
flex: 0 0 auto
}

.stay-mini-card label {
display: block;
color: var(--muted);
font-size: .78rem;
text-transform: uppercase;
letter-spacing: .08em;
font-weight: 950
}

.stay-mini-card strong {
display: block;
color: var(--navy);
line-height: 1.2
}

.similar-detail-section { padding-top: 46px }

.detail-empty {
padding: 44px;
text-align: center
}

.request-card { min-width: 0 }

.badge-featured {
background: rgba(245,158,11,.13);
color: #a16207;
border-color: rgba(245,158,11,.24)
}

.badge-request, .status-open {
background: rgba(22,184,166,.13);
color: var(--teal-2);
border-color: rgba(22,184,166,.22)
}

.messages-hero-card {
display: flex;
align-items: end;
justify-content: space-between;
gap: 20px;
background: linear-gradient(135deg, #fff, rgba(22,184,166,.08));
border: 1px solid var(--line);
border-radius: 34px;
box-shadow: var(--shadow-sm);
padding: clamp(22px, 4vw, 34px);
margin-bottom: 20px
}

.messages-hero-card h1 {
font-size: clamp(2.1rem, 5vw, 4.2rem);
line-height: .98;
letter-spacing: -.07em;
color: var(--navy);
margin: 8px 0 8px
}

.messages-hero-card p {
color: var(--muted);
font-weight: 700;
max-width: 680px
}

.messages-modern-list {
display: grid;
gap: 12px
}

.message-thread-card {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 15px;
align-items: center;
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
padding: 16px;
box-shadow: var(--shadow-xs);
transition: .22s var(--ease)
}

.message-thread-card:hover {
transform: translateY(-3px);
box-shadow: var(--shadow-sm);
border-color: rgba(22,184,166,.35)
}

.message-thread-card.is-unread {
background: linear-gradient(90deg, rgba(255,122,89,.08), #fff);
border-color: rgba(255,122,89,.28)
}

.thread-avatar { position: relative }

.thread-avatar img {
width: 58px;
height: 58px;
border-radius: 20px;
object-fit: cover;
border: 1px solid var(--line)
}

.thread-avatar span {
position: absolute;
right: -6px;
top: -6px;
min-width: 23px;
height: 23px;
border-radius: 999px;
background: var(--coral);
color: #fff;
border: 2px solid #fff;
display: grid;
place-items: center;
font-size: .72rem;
font-weight: 950
}

.thread-main { min-width: 0 }

.thread-topline {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px
}

.thread-topline h2 {
margin: 0;
color: var(--navy);
font-size: 1.08rem;
letter-spacing: -.03em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.thread-topline time {
color: var(--muted);
font-size: .82rem;
font-weight: 850;
white-space: nowrap
}

.thread-context {
margin: 3px 0;
color: var(--teal-2);
font-size: .84rem;
font-weight: 900;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.thread-preview {
margin: 0;
color: var(--muted);
font-weight: 700;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}

.thread-arrow {
width: 40px;
height: 40px;
border-radius: 16px;
background: #f8fafc;
border: 1px solid var(--line);
display: grid;
place-items: center;
color: var(--navy)
}

.messages-empty-modern {
text-align: center;
padding: 42px
}

.conversation-modern-card {
background: rgba(255,255,255,.96);
border: 1px solid var(--line);
border-radius: 34px;
box-shadow: var(--shadow-md);
overflow: hidden
}

.conversation-modern-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 22px;
border-bottom: 1px solid var(--line);
background: linear-gradient(135deg, #fff, rgba(247,239,229,.68))
}

.conversation-person {
display: flex;
align-items: center;
gap: 15px;
min-width: 0
}

.conversation-person img {
width: 68px;
height: 68px;
border-radius: 24px;
object-fit: cover;
border: 1px solid var(--line)
}

.conversation-person h1 {
font-size: clamp(1.6rem, 3vw, 2.35rem);
margin: 5px 0 4px;
color: var(--navy);
line-height: 1;
letter-spacing: -.05em
}

.conversation-person p {
margin: 0;
color: var(--muted);
font-weight: 750
}

.conversation-context-card {
display: flex;
gap: 14px;
margin: 18px 22px 0;
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 24px;
padding: 16px;
transition: .22s var(--ease)
}

.conversation-context-card:hover {
background: #fff;
box-shadow: var(--shadow-xs)
}

.conversation-context-card>span {
width: 50px;
height: 50px;
border-radius: 18px;
background: rgba(22,184,166,.12);
color: var(--teal);
display: grid;
place-items: center;
flex: 0 0 auto
}

.conversation-context-card label {
display: block;
color: var(--muted);
font-size: .78rem;
font-weight: 950;
letter-spacing: .08em;
text-transform: uppercase
}

.conversation-context-card strong {
display: block;
color: var(--navy);
line-height: 1.2
}

.conversation-context-card p {
margin: 4px 0 0;
color: var(--muted);
font-weight: 700
}

.conversation-thread {
height: min(62vh, 620px);
min-height: 200px;
overflow: auto;
display: grid;
align-content: start;
gap: 12px;
padding: 22px;
background: linear-gradient(180deg, #fff, #fbfdff)
}

.chat-bubble {
max-width: min(75%, 720px);
display: grid;
gap: 5px
}

.chat-bubble.is-own { justify-self: end }

.chat-bubble.is-other { justify-self: start }

.chat-bubble-body {
padding: 13px 15px;
border-radius: 20px;
border: 1px solid var(--line);
box-shadow: var(--shadow-xs);
background: #fff;
color: var(--ink);
white-space: pre-wrap;
overflow-wrap: anywhere
}

.chat-bubble.is-own .chat-bubble-body {
background: var(--navy);
color: #fff;
border-color: var(--navy)
}

.chat-bubble time {
font-size: .75rem;
color: var(--muted);
font-weight: 800
}

.chat-bubble.is-own time { text-align: right }

.conversation-compose {
border-top: 1px solid var(--line);
padding: 18px 22px;
background: #fff
}

.conversation-compose textarea {
width: 100%;
min-height: 92px;
border: 1px solid var(--line);
border-radius: 22px;
background: #f8fafc;
padding: 15px 16px;
outline: none;
resize: vertical
}

.conversation-compose textarea:focus {
background: #fff;
border-color: rgba(22,184,166,.65);
box-shadow: 0 0 0 4px rgba(22,184,166,.1)
}

.compose-actions {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
margin-top: 11px
}

.compose-actions small {
color: var(--muted);
font-weight: 750
}

@media(max-width: 900px) {

.detail-hero-card, .detail-grid-v2 { grid-template-columns: 1fr }

.detail-side-card { min-height: unset }

.messages-hero-card { display: grid }

.info-tile-grid { grid-template-columns: 1fr }

.chat-bubble { max-width: 90% }
}

@media(max-width: 640px) {

.detail-page-wrap, .messages-modern-wrap, .conversation-modern-wrap { padding-block: 24px 56px }

.detail-hero-card {
border-radius: 28px;
padding: 20px
}

.detail-actions-row .btn, .profile-mini-actions .btn, .messages-hero-card .btn { width: 100% }

.detail-meta-strip span {
width: 100%;
border-radius: 16px
}

.detail-content-card, .profile-mini-card, .stay-mini-card {
border-radius: 24px;
padding: 18px
}

.messages-hero-card { border-radius: 26px }

.message-thread-card {
grid-template-columns: auto minmax(0, 1fr);
align-items: start
}

.thread-arrow { display: none }

.thread-topline { display: block }

.conversation-modern-header {
align-items: flex-start;
display: grid
}

.conversation-person img {
width: 58px;
height: 58px;
border-radius: 20px
}

.conversation-thread {
height: 58vh;
padding: 16px
}

.chat-bubble { max-width: 94% }

.compose-actions { display: grid }

.compose-actions .btn { width: 100% }
}

/* Offer detail polish - aligned with the latest LobbiLink detail template */
.offer-detail-v2 .detail-side-card.price-card { background: radial-gradient(circle at 20% 0, rgba(255,122,89,.24), transparent 36%), linear-gradient(135deg, var(--navy), #12385f) }

.offer-detail-v2 .badge-offer {
background: rgba(22,184,166,.13);
color: var(--teal-2);
border-color: rgba(22,184,166,.22)
}

.offer-card h3, .request-card h3 {
font-size: 1.14rem;
line-height: 1.2;
color: var(--navy);
letter-spacing: -.025em;
margin: 12px 0 9px
}

.offer-card p, .request-card p {
color: var(--muted);
font-size: .96rem;
line-height: 1.6;
margin: 0
}

.offer-card .card-actions strong, .request-card .card-actions strong {
color: var(--navy);
font-weight: 950
}

.user-offers-modern { padding-top: 22px }

@media(max-width: 640px) {

.offer-detail-v2 .detail-lead { font-size: 1rem }

.offer-card, .request-card {
padding: 18px;
border-radius: 22px
}
}

/* =====================================================================
   Homepage showcase map v2 - modern hero visual
   ===================================================================== */
.hero-showcase {
min-height: 560px;
display: flex;
align-items: center
}

.showcase-map.showcase-map-v2 {
isolation: isolate;
height: 560px;
width: 100%;
border-radius: 44px;
background: radial-gradient(circle at 20% 18%, rgba(255,122,89,.16), transparent 30%), radial-gradient(circle at 86% 74%, rgba(22,184,166,.20), transparent 32%), linear-gradient(145deg, rgba(255,255,255,.96), rgba(247,239,229,.72) 45%, rgba(234,255,251,.90));
border: 1px solid rgba(255,255,255,.72);
box-shadow: 0 28px 90px rgba(14,42,71,.18), inset 0 1px 0 rgba(255,255,255,.85);
overflow: hidden;
}

.showcase-map.showcase-map-v2:before {
content: "";
position: absolute;
inset: 54px 34px 34px;
border-radius: 34px;
background-image: linear-gradient(rgba(14,42,71,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(14,42,71,.055) 1px, transparent 1px), radial-gradient(circle at 48% 47%, rgba(255,255,255,.75), transparent 34%);
background-size: 44px 44px, 44px 44px, 100% 100%;
mask-image: linear-gradient(180deg, transparent 0, #000 10%, #000 88%, transparent 100%);
}

.showcase-map.showcase-map-v2:after {
content: "";
position: absolute;
left: 50%;
top: 52%;
width: 310px;
height: 310px;
transform: translate(-50%, -50%);
border-radius: 50%;
border: 1px solid rgba(22,184,166,.22);
box-shadow: 0 0 0 56px rgba(22,184,166,.06), 0 0 0 116px rgba(255,122,89,.055);
animation: showcaseBreath 5s var(--ease) infinite;
z-index: 0;
}

.showcase-glow {
position: absolute;
border-radius: 999px;
filter: blur(8px);
opacity: .72;
z-index: 0;
pointer-events: none
}

.showcase-glow.glow-coral {
width: 220px;
height: 220px;
left: -70px;
top: 74px;
background: rgba(255,122,89,.18)
}

.showcase-glow.glow-teal {
width: 260px;
height: 260px;
right: -95px;
bottom: 36px;
background: rgba(22,184,166,.18)
}

.showcase-topbar {
position: absolute;
left: 24px;
right: 24px;
top: 22px;
z-index: 4;
display: flex;
align-items: center;
gap: 8px;
padding: 12px 15px;
border-radius: 20px;
background: rgba(255,255,255,.68);
border: 1px solid rgba(255,255,255,.75);
box-shadow: var(--shadow-xs);
backdrop-filter: blur(16px)
}

.showcase-topbar strong {
margin-left: 8px;
color: var(--navy);
font-size: .88rem;
letter-spacing: -.02em
}

.window-dot {
width: 10px;
height: 10px;
border-radius: 50%;
display: inline-block
}

.dot-coral { background: var(--coral) }

.dot-teal { background: var(--teal) }

.dot-navy { background: var(--navy) }

.showcase-route {
position: absolute;
inset: 54px 18px 18px;
z-index: 1;
overflow: visible
}

.showcase-route .route {
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
stroke-dasharray: 8 12;
animation: routeDash 18s linear infinite
}

.showcase-route .route-main {
stroke: url(#none);
stroke: rgba(22,184,166,.72);
stroke-width: 5
}

.showcase-route .route-soft {
stroke: rgba(255,122,89,.34);
stroke-width: 3;
animation-direction: reverse
}

.showcase-map-v2 .map-pin {
width: 18px;
height: 18px;
display: grid;
place-items: center;
border: 3px solid #fff;
z-index: 3
}

.showcase-map-v2 .map-pin span {
display: block;
width: 6px;
height: 6px;
border-radius: 50%;
background: #fff
}

.showcase-map-v2 .pin-a {
left: 15%;
top: 60%;
background: var(--coral)
}

.showcase-map-v2 .pin-b {
right: 13%;
top: 24%;
background: var(--teal);
box-shadow: 0 0 0 10px rgba(22,184,166,.14)
}

.showcase-map-v2 .pin-c {
left: 50%;
bottom: 22%;
background: var(--navy);
box-shadow: 0 0 0 10px rgba(14,42,71,.12)
}

.showcase-map-v2 .pin-d {
left: 56%;
top: 39%;
background: #fff;
border-color: var(--coral);
box-shadow: 0 0 0 10px rgba(255,122,89,.13)
}

.showcase-map-v2 .pin-d span { background: var(--coral) }

.showcase-hub {
position: absolute;
left: 50%;
top: 50%;
z-index: 4;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
gap: 13px;
min-width: 245px;
padding: 14px 16px;
border-radius: 26px;
background: rgba(255,255,255,.88);
border: 1px solid rgba(255,255,255,.9);
box-shadow: 0 20px 54px rgba(14,42,71,.16);
backdrop-filter: blur(16px)
}

.showcase-hub img {
width: 54px;
height: 54px;
border-radius: 18px;
object-fit: contain;
background: #fff;
border: 1px solid var(--line);
padding: 5px
}

.showcase-hub span {
display: block;
color: var(--teal-2);
font-size: .72rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .1em
}

.showcase-hub strong {
display: block;
color: var(--navy);
font-size: 1.25rem;
letter-spacing: -.045em;
line-height: 1.05
}

.showcase-hub small {
display: block;
color: var(--muted);
font-weight: 800;
font-size: .78rem
}

.showcase-map-v2 .showcase-card {
background: rgba(255,255,255,.84);
border: 1px solid rgba(255,255,255,.86);
box-shadow: 0 16px 48px rgba(14,42,71,.12);
backdrop-filter: blur(18px);
z-index: 5
}

.showcase-map-v2 .stay-card {
left: 28px;
top: 82px;
min-width: 270px;
border-radius: 26px;
padding: 18px
}

.showcase-map-v2 .stay-card strong {
font-size: 1.08rem;
letter-spacing: -.025em
}

.mini-progress {
height: 8px;
border-radius: 999px;
background: #edf3f6;
margin-top: 14px;
overflow: hidden
}

.mini-progress i {
display: block;
height: 100%;
width: 72%;
border-radius: inherit;
background: linear-gradient(90deg, var(--coral), var(--teal))
}

.service-card-modern {
display: flex;
align-items: center;
gap: 12px;
border-radius: 24px;
min-width: 238px;
padding: 14px 15px
}

.service-card-modern b {
font-size: .96rem;
line-height: 1.16;
margin: 0 0 3px
}

.service-card-modern small { font-size: .78rem }

.service-icon {
width: 42px;
height: 42px;
border-radius: 16px;
display: grid;
place-items: center;
flex: 0 0 auto
}

.service-icon.coral {
background: rgba(255,122,89,.13);
color: var(--coral)
}

.service-icon.teal {
background: rgba(22,184,166,.13);
color: var(--teal-2)
}

.service-icon.navy {
background: rgba(14,42,71,.10);
color: var(--navy)
}

.showcase-map-v2 .service-a {
right: 20px;
top: 148px
}

.showcase-map-v2 .service-b {
left: 24px;
bottom: 122px
}

.showcase-map-v2 .service-c {
right: 26px;
bottom: 108px
}

.traveller-bubble {
position: absolute;
z-index: 4;
display: flex;
align-items: center;
gap: 8px;
padding: 8px 10px;
border-radius: 999px;
background: rgba(255,255,255,.82);
border: 1px solid rgba(255,255,255,.9);
box-shadow: 0 14px 34px rgba(14,42,71,.10);
backdrop-filter: blur(14px);
animation: floatSoft 5.8s var(--ease) infinite
}

.traveller-bubble b {
width: 34px;
height: 34px;
border-radius: 50%;
display: grid;
place-items: center;
color: #fff;
background: linear-gradient(135deg, var(--coral), var(--teal));
font-size: .78rem
}

.traveller-bubble span {
color: var(--navy);
font-size: .76rem;
font-weight: 950
}

.bubble-a {
left: 96px;
top: 286px
}

.bubble-b {
right: 70px;
top: 286px;
animation-delay: .8s
}

.bubble-c {
left: 284px;
bottom: 54px;
animation-delay: 1.6s
}

.showcase-panel {
position: absolute;
left: 28px;
right: 28px;
bottom: 24px;
z-index: 5;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
padding: 11px;
border-radius: 25px;
background: rgba(14,42,71,.92);
box-shadow: 0 18px 42px rgba(14,42,71,.20);
backdrop-filter: blur(16px)
}

.showcase-panel div {
padding: 10px 8px;
border-radius: 18px;
background: rgba(255,255,255,.08);
text-align: center
}

.showcase-panel strong {
display: block;
color: #fff;
font-size: 1.2rem;
line-height: 1;
font-weight: 950
}

.showcase-panel span {
display: block;
color: rgba(255,255,255,.68);
font-size: .72rem;
font-weight: 850;
margin-top: 4px
}
 @keyframes showcaseBreath {
 50% {
 transform: translate(-50%, -50%) scale(1.04);
 opacity: .72
}
}
 @keyframes routeDash {
 to {
 stroke-dashoffset: -220
}
}
 @keyframes floatSoft {
 50% {
 transform: translateY(-10px)
}
}

@media (max-width: 1100px) {

.hero-showcase { min-height: 500px }

.showcase-map.showcase-map-v2 { height: 500px }

.showcase-map-v2 .service-a {
right: 24px;
top: 132px
}

.showcase-map-v2 .service-c { bottom: 88px }

.bubble-c { display: none }

.showcase-panel { bottom: 20px }
}

@media (max-width: 900px) {

.hero-showcase {
display: block;
min-height: 440px
}

.showcase-map.showcase-map-v2 {
height: 440px;
border-radius: 34px
}

.showcase-map-v2 .stay-card {
left: 18px;
top: 76px;
min-width: 230px
}

.showcase-map-v2 .service-b {
left: 18px;
bottom: 96px
}

.showcase-map-v2 .service-c {
right: 18px;
bottom: 96px
}

.showcase-panel {
left: 18px;
right: 18px;
bottom: 16px
}

.showcase-hub { min-width: 220px }

.traveller-bubble { display: none }
}

@media (max-width: 640px) {

.hero-showcase { min-height: 390px }

.showcase-map.showcase-map-v2 {
height: 390px;
border-radius: 28px
}

.showcase-topbar {
left: 14px;
right: 14px;
top: 14px
}

.showcase-map-v2 .stay-card {
left: 14px;
right: 14px;
top: 66px;
min-width: 0
}

.showcase-hub {
top: 55%;
min-width: 210px
}

.showcase-map-v2 .service-a, .showcase-map-v2 .service-b, .showcase-map-v2 .service-c { display: none }

.showcase-panel {
grid-template-columns: repeat(3, 1fr);
gap: 7px;
padding: 8px
}

.showcase-panel span { font-size: .66rem }

.showcase-panel strong { font-size: 1rem }
}

/* =====================================================================
   Homepage showcase map - simplified clean version
   ===================================================================== */
.hero-showcase {
min-height: 520px;
display: flex;
align-items: center
}

.showcase-map.showcase-map-simple {
position: relative;
height: 520px;
width: 100%;
border-radius: 42px;
overflow: hidden;
background: radial-gradient(circle at 18% 20%, rgba(255,122,89,.14), transparent 34%), radial-gradient(circle at 84% 76%, rgba(22,184,166,.16), transparent 34%), linear-gradient(145deg, #ffffff 0%, #fff7ef 48%, #effffb 100%);
border: 1px solid rgba(230,237,245,.86);
box-shadow: 0 26px 78px rgba(14,42,71,.14);
isolation: isolate;
}

.showcase-map.showcase-map-simple:before, .showcase-map.showcase-map-simple:after {
display: none;
content: none
}

.showcase-simple-bg {
position: absolute;
inset: 32px;
border-radius: 34px;
background: linear-gradient(rgba(14,42,71,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(14,42,71,.045) 1px, transparent 1px);
background-size: 54px 54px;
opacity: .75;
mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 82%, transparent 100%);
z-index: 0;
}

.simple-network-card {
position: absolute;
left: 50%;
top: 47%;
transform: translate(-50%, -50%);
z-index: 4;
display: flex;
align-items: center;
gap: 16px;
width: min(360px, calc(100% - 64px));
padding: 20px;
border-radius: 30px;
background: rgba(255,255,255,.88);
border: 1px solid rgba(255,255,255,.92);
box-shadow: 0 22px 58px rgba(14,42,71,.14);
backdrop-filter: blur(18px);
}

.simple-network-logo {
width: 70px;
height: 70px;
display: grid;
place-items: center;
flex: 0 0 auto;
border-radius: 24px;
background: #fff;
border: 1px solid var(--line);
box-shadow: var(--shadow-sm);
}

.simple-network-logo img {
width: 56px;
height: 56px;
object-fit: contain
}

.simple-network-card span {
display: block;
color: var(--teal-2);
font-size: .73rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .11em;
margin-bottom: 4px;
}

.simple-network-card strong {
display: block;
color: var(--navy);
font-size: 1.48rem;
line-height: 1.05;
letter-spacing: -.05em;
}

.simple-network-card small {
display: block;
color: var(--muted);
font-weight: 800;
margin-top: 4px
}

.simple-link-line {
position: absolute;
left: 17%;
right: 17%;
top: 47%;
height: 3px;
z-index: 1;
background: linear-gradient(90deg, rgba(255,122,89,.15), rgba(255,122,89,.72), rgba(22,184,166,.72), rgba(22,184,166,.15));
border-radius: 999px;
}

.simple-link-line:before, .simple-link-line:after {
content: "";
position: absolute;
top: 50%;
width: 14px;
height: 14px;
margin-top: -7px;
border-radius: 50%;
background: #fff;
border: 4px solid var(--coral);
box-shadow: 0 0 0 9px rgba(255,122,89,.11);
}

.simple-link-line:after {
right: 0;
border-color: var(--teal);
box-shadow: 0 0 0 9px rgba(22,184,166,.11)
}

.simple-link-line:before { left: 0 }

.simple-service-card {
position: absolute;
z-index: 3;
display: flex;
align-items: center;
gap: 13px;
width: 250px;
padding: 15px;
border-radius: 24px;
background: rgba(255,255,255,.86);
border: 1px solid rgba(255,255,255,.9);
box-shadow: 0 16px 42px rgba(14,42,71,.10);
backdrop-filter: blur(14px);
}

.simple-service-left {
left: 30px;
top: 126px
}

.simple-service-right {
right: 30px;
bottom: 132px
}

.simple-service-icon {
width: 46px;
height: 46px;
display: grid;
place-items: center;
flex: 0 0 auto;
border-radius: 17px;
}

.simple-service-icon.coral {
background: rgba(255,122,89,.13);
color: var(--coral)
}

.simple-service-icon.teal {
background: rgba(22,184,166,.13);
color: var(--teal-2)
}

.simple-service-card b {
display: block;
margin: 0 0 2px;
color: var(--muted);
font-size: .72rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .09em;
}

.simple-service-card strong {
display: block;
color: var(--navy);
font-size: 1rem;
line-height: 1.15;
letter-spacing: -.025em
}

.simple-service-card small {
display: block;
color: var(--muted);
font-size: .78rem;
font-weight: 750;
margin-top: 3px
}

.simple-showcase-footer {
position: absolute;
left: 30px;
right: 30px;
bottom: 28px;
z-index: 4;
display: flex;
justify-content: center;
gap: 10px;
flex-wrap: wrap;
}

.simple-showcase-footer span {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 9px 12px;
border-radius: 999px;
background: rgba(255,255,255,.78);
border: 1px solid rgba(255,255,255,.88);
color: var(--muted);
font-size: .8rem;
font-weight: 850;
box-shadow: var(--shadow-xs);
backdrop-filter: blur(12px);
}

.simple-showcase-footer strong {
color: var(--navy);
font-size: .95rem
}

@media (max-width: 1100px) {

.hero-showcase { min-height: 470px }

.showcase-map.showcase-map-simple { height: 470px }

.simple-service-card { width: 232px }

.simple-service-left {
left: 22px;
top: 112px
}

.simple-service-right {
right: 22px;
bottom: 116px
}
}

@media (max-width: 900px) {

.hero-showcase {
display: block;
min-height: 430px
}

.showcase-map.showcase-map-simple {
height: 430px;
border-radius: 34px
}

.simple-network-card {
top: 44%;
width: min(340px, calc(100% - 44px));
padding: 18px
}

.simple-link-line {
left: 14%;
right: 14%;
top: 44%
}

.simple-service-left {
left: 22px;
top: 92px
}

.simple-service-right {
right: 22px;
bottom: 92px
}

.simple-service-card { width: 220px }

.simple-showcase-footer {
bottom: 18px;
left: 18px;
right: 18px
}
}

@media (max-width: 640px) {

.hero-showcase { min-height: 360px }

.showcase-map.showcase-map-simple {
height: 360px;
border-radius: 28px
}

.showcase-simple-bg {
inset: 22px;
background-size: 44px 44px
}

.simple-network-card {
top: 42%;
display: grid;
text-align: center;
justify-items: center;
gap: 10px;
padding: 18px;
width: calc(100% - 40px)
}

.simple-network-logo {
width: 62px;
height: 62px;
border-radius: 21px
}

.simple-network-logo img {
width: 50px;
height: 50px
}

.simple-network-card strong { font-size: 1.28rem }

.simple-link-line {
top: 42%;
left: 10%;
right: 10%;
opacity: .55
}

.simple-service-card { display: none }

.simple-showcase-footer {
display: grid;
grid-template-columns: 1fr;
gap: 7px
}

.simple-showcase-footer span {
justify-content: center;
border-radius: 16px;
padding: 8px 10px
}
}

@media (prefers-reduced-motion:reduce) {

.showcase-map.showcase-map-simple * {
animation: none!important;
transition: none!important
}
}

/* =====================================================================
   Showcase Variant 2: clean phone app mockup
   ===================================================================== */
.hero-showcase {
display: grid;
place-items: center;
min-height: 560px
}

.showcase-phone {
position: relative;
width: min(100%, 470px);
min-height: 560px;
display: grid;
place-items: center
}

.showcase-phone:before {
content: "";
position: absolute;
inset: 22px 0;
background: radial-gradient(circle at 25% 18%, rgba(255,122,89,.18), transparent 12rem), radial-gradient(circle at 80% 72%, rgba(22,184,166,.20), transparent 13rem);
border-radius: 46px;
filter: blur(2px)
}

.phone-shell {
position: relative;
width: 310px;
height: 560px;
border-radius: 42px;
padding: 13px;
background: linear-gradient(155deg, var(--navy), #173f69);
box-shadow: 0 30px 90px rgba(14,42,71,.24), 0 12px 26px rgba(14,42,71,.14);
border: 1px solid rgba(255,255,255,.16);
z-index: 2
}

.phone-shell:after {
content: "";
position: absolute;
inset: 7px;
border-radius: 38px;
border: 1px solid rgba(255,255,255,.12);
pointer-events: none
}

.phone-speaker {
position: absolute;
left: 50%;
top: 13px;
transform: translateX(-50%);
width: 74px;
height: 6px;
border-radius: 999px;
background: rgba(255,255,255,.28);
z-index: 4
}

.phone-screen {
height: 100%;
border-radius: 32px;
background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
padding: 28px 16px 16px;
overflow: hidden;
position: relative
}

.phone-screen:before {
content: "";
position: absolute;
inset: -58px -80px auto auto;
width: 190px;
height: 190px;
border-radius: 50%;
background: rgba(22,184,166,.13)
}

.phone-app-head {
position: relative;
display: flex;
align-items: center;
gap: 10px;
margin: 4px 0 16px
}

.phone-app-head img {
width: 40px;
height: 40px;
border-radius: 14px;
background: #fff;
box-shadow: var(--shadow-xs)
}

.phone-app-head strong {
display: block;
color: var(--navy);
font-weight: 950;
letter-spacing: -.035em
}

.phone-app-head span {
display: block;
color: var(--muted);
font-size: .78rem;
font-weight: 800
}

.phone-location-card {
position: relative;
background: linear-gradient(135deg, rgba(255,122,89,.12), rgba(22,184,166,.12));
border: 1px solid rgba(230,237,245,.96);
border-radius: 24px;
padding: 16px;
margin-bottom: 14px
}

.phone-location-card span {
display: flex;
align-items: center;
gap: 6px;
color: var(--teal-2);
font-size: .75rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .08em;
margin-bottom: 7px
}

.phone-location-card strong {
display: block;
color: var(--navy);
font-size: 1.18rem;
letter-spacing: -.035em
}

.phone-location-card small {
display: block;
color: #64748b;
font-weight: 800;
margin-top: 2px
}

.phone-tabs {
display: flex;
gap: 8px;
margin: 0 0 12px
}

.phone-tabs span {
flex: 1;
text-align: center;
padding: 9px 8px;
border-radius: 999px;
background: #eef4f7;
color: #64748b;
font-weight: 950;
font-size: .78rem
}

.phone-tabs span.active {
background: var(--navy);
color: #fff
}

.phone-list-card {
display: flex;
align-items: center;
gap: 11px;
background: #fff;
border: 1px solid rgba(230,237,245,.95);
border-radius: 20px;
padding: 12px;
margin-bottom: 10px;
box-shadow: 0 8px 22px rgba(14,42,71,.06);
position: relative;
z-index: 1
}

.phone-list-card b {
display: block;
color: var(--navy);
font-size: .94rem;
line-height: 1.16
}

.phone-list-card small {
display: block;
color: var(--muted);
font-size: .75rem;
font-weight: 800;
margin-top: 2px
}

.phone-card-icon {
width: 40px;
height: 40px;
border-radius: 15px;
display: grid;
place-items: center;
flex: 0 0 auto
}

.phone-card-icon.coral {
background: rgba(255,122,89,.13);
color: var(--coral)
}

.phone-card-icon.teal {
background: rgba(22,184,166,.13);
color: var(--teal-2)
}

.phone-card-icon.navy {
background: rgba(14,42,71,.10);
color: var(--navy)
}

.phone-request-card {
transform: translateX(14px);
width: calc(100% - 14px)
}

.phone-float-badge {
position: absolute;
z-index: 4;
display: flex;
align-items: center;
gap: 8px;
padding: 10px 13px;
border-radius: 999px;
background: rgba(255,255,255,.88);
border: 1px solid rgba(230,237,245,.95);
box-shadow: var(--shadow-md);
backdrop-filter: blur(14px);
color: var(--navy);
font-weight: 950;
font-size: .84rem;
animation: phoneFloat 5s var(--ease) infinite
}

.phone-float-badge .inline-icon { color: var(--teal-2) }

.phone-float-badge.badge-top {
right: 0;
top: 74px
}

.phone-float-badge.badge-bottom {
left: 0;
bottom: 118px;
animation-delay: 1.2s
}

.phone-float-badge.badge-bottom .inline-icon { color: var(--coral) }
 @keyframes phoneFloat {
 0%, 100% {
 transform: translateY(0)
}
 50% {
 transform: translateY(-9px)
}
}

@media (max-width: 1100px) {

.hero-showcase {
display: grid;
min-height: 540px
}

.showcase-phone { min-height: 540px }

.phone-shell { height: 535px }
}

@media (max-width: 900px) {

.hero-showcase {
display: grid;
min-height: 520px;
margin-top: 18px
}

.showcase-phone { min-height: 520px }

.phone-shell {
width: 292px;
height: 518px
}

.phone-float-badge.badge-top { right: 8px }

.phone-float-badge.badge-bottom {
left: 8px;
bottom: 100px
}
}

@media (max-width: 640px) {

.hero-showcase { min-height: 470px }

.showcase-phone { min-height: 470px }

.phone-shell {
width: min(286px, 100%);
height: 488px;
border-radius: 36px
}

.phone-screen {
border-radius: 28px;
padding: 26px 13px 13px
}

.phone-float-badge { display: none }

.phone-location-card { padding: 14px }

.phone-list-card { padding: 10px }

.phone-request-card {
transform: none;
width: 100%
}
}

@media (prefers-reduced-motion:reduce) {

.phone-float-badge { animation: none!important }
}

/* Restored modern profile page design (kept after homepage phone showcase update) */
.profile-modern-wrap { padding-block: 42px 82px }

.profile-modern-hero {
position: relative;
overflow: hidden;
border: 1px solid var(--line);
border-radius: 38px;
background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(22,184,166,.08));
box-shadow: var(--shadow-md);
margin-bottom: 18px
}

.profile-cover-layer {
position: absolute;
inset: 0 0 auto;
height: 180px;
background: radial-gradient(circle at 12% 20%, rgba(255,122,89,.28), transparent 32%), radial-gradient(circle at 88% 8%, rgba(22,184,166,.26), transparent 28%), linear-gradient(135deg, var(--navy), #12385f);
background-size: cover;
background-position: center;
opacity: .98
}

.profile-cover-layer:after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(14,42,71,.05), rgba(255,255,255,.96) 88%)
}

.profile-hero-content {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 24px;
align-items: end;
padding: 120px clamp(22px, 4vw, 42px) clamp(24px, 4vw, 38px)
}

.profile-avatar-modern {
width: 156px;
height: 156px;
border-radius: 38px;
padding: 7px;
background: #fff;
box-shadow: 0 18px 50px rgba(14,42,71,.18);
border: 1px solid rgba(255,255,255,.9)
}

.profile-avatar-modern img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 31px;
background: #fff
}

.profile-hero-main h1 {
font-size: clamp(2.25rem, 5vw, 4.8rem);
line-height: .95;
letter-spacing: -.075em;
color: var(--navy);
margin: 0 0 12px
}

.profile-hero-bio {
max-width: 820px;
color: #53657c;
font-size: 1.08rem;
font-weight: 680;
line-height: 1.65;
margin: 0 0 16px
}

.profile-hero-meta {
display: flex;
gap: 10px;
flex-wrap: wrap;
margin: 16px 0 20px
}

.profile-hero-meta span {
display: inline-flex;
align-items: center;
gap: 7px;
background: #fff;
border: 1px solid var(--line);
border-radius: 999px;
padding: 9px 12px;
color: #52647a;
font-size: .9rem;
font-weight: 850;
box-shadow: var(--shadow-xs)
}

.profile-hero-actions {
display: flex;
gap: 11px;
flex-wrap: wrap
}

.profile-stat-strip {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 14px;
margin: 18px 0 22px
}

.profile-stat-card {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 12px;
align-items: center;
background: #fff;
border: 1px solid var(--line);
border-radius: 24px;
padding: 18px;
box-shadow: var(--shadow-xs)
}

.profile-stat-card span {
grid-row: span 2;
width: 48px;
height: 48px;
border-radius: 18px;
display: grid;
place-items: center;
background: linear-gradient(135deg, rgba(255,122,89,.14), rgba(22,184,166,.14));
color: var(--teal)
}

.profile-stat-card strong {
display: block;
font-size: 1.65rem;
line-height: 1;
color: var(--navy);
font-weight: 950;
letter-spacing: -.04em
}

.profile-stat-card small {
display: block;
color: var(--muted);
font-weight: 850
}

.profile-modern-grid {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(310px, 380px);
gap: 22px;
align-items: start
}

.profile-main-column, .profile-side-column {
display: grid;
gap: 18px
}

.profile-section-card {
background: rgba(255,255,255,.94);
border: 1px solid var(--line);
border-radius: 30px;
box-shadow: var(--shadow-sm);
padding: 24px
}

.profile-section-card .panel-head { margin-bottom: 16px }

.profile-section-card .panel-head span {
color: var(--muted);
font-weight: 900
}

.profile-listing-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px
}

.profile-listing-grid.compact { grid-template-columns: 1fr }

.profile-listing-card {
position: relative;
overflow: hidden;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 14px;
background: #fff;
border: 1px solid var(--line);
border-radius: 24px;
padding: 16px;
box-shadow: var(--shadow-xs);
transition: .22s var(--ease)
}

.profile-listing-card:hover {
transform: translateY(-3px);
box-shadow: var(--shadow-sm);
border-color: rgba(22,184,166,.34)
}

.profile-listing-card:before {
content: "";
position: absolute;
right: -32px;
top: -42px;
width: 105px;
height: 105px;
border-radius: 50%;
background: rgba(22,184,166,.08)
}

.profile-listing-card.request-version:before { background: rgba(255,122,89,.08) }

.profile-listing-icon {
position: relative;
z-index: 1;
width: 52px;
height: 52px;
border-radius: 18px;
display: grid;
place-items: center;
background: rgba(22,184,166,.12);
color: var(--teal);
flex: 0 0 auto
}

.profile-listing-card.request-version .profile-listing-icon {
background: rgba(255,122,89,.13);
color: var(--coral)
}

.profile-listing-body {
position: relative;
z-index: 1;
min-width: 0
}

.profile-listing-body h3 {
font-size: 1.12rem;
line-height: 1.22;
margin: 10px 0 7px;
color: var(--navy);
letter-spacing: -.025em
}

.profile-listing-body h3 a:hover { color: var(--teal-2) }

.profile-listing-body p {
color: var(--muted);
font-weight: 700;
font-size: .94rem;
line-height: 1.55;
margin: 0
}

.profile-listing-meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
flex-wrap: wrap;
margin-top: 12px
}

.profile-listing-meta span {
display: inline-flex;
align-items: center;
gap: 5px;
color: var(--muted);
font-size: .84rem;
font-weight: 850
}

.profile-listing-meta strong {
color: var(--navy);
font-weight: 950
}

.profile-detail-list {
display: grid;
gap: 12px;
margin-top: 14px
}

.profile-detail-list>div {
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 10px;
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 20px;
padding: 13px
}

.profile-detail-list>div>span {
grid-row: span 2;
width: 40px;
height: 40px;
border-radius: 15px;
background: #fff;
display: grid;
place-items: center;
color: var(--teal);
box-shadow: var(--shadow-xs)
}

.profile-detail-list label {
font-size: .75rem;
text-transform: uppercase;
letter-spacing: .08em;
font-weight: 950;
color: var(--muted)
}

.profile-detail-list strong {
display: block;
color: var(--navy);
font-size: .96rem;
line-height: 1.35;
overflow-wrap: anywhere
}

.profile-detail-list a { color: var(--teal-2) }

.sticky-lite {
position: sticky;
top: calc(var(--header-h, 80px) + 18px)
}

.review-panel-card {
display: grid;
gap: 14px
}

.review-modern-form {
border: 1px solid var(--line);
border-radius: 24px;
padding: 16px;
background: linear-gradient(180deg, #fff, #fbfdff)
}

.review-modern-list {
display: grid;
gap: 11px
}

.review-modern-item {
background: #fff;
border: 1px solid var(--line);
border-radius: 22px;
padding: 15px;
box-shadow: var(--shadow-xs)
}

.review-modern-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 8px
}

.review-modern-head strong {
color: var(--navy);
font-weight: 950
}

.review-modern-head span {
white-space: nowrap;
color: #cbd5e1
}

.review-modern-head b {
font-style: normal;
color: #cbd5e1
}

.review-modern-head b.is-filled { color: var(--warning) }

.review-modern-item p {
margin: 0;
color: #36465c;
font-weight: 700;
line-height: 1.55
}

.review-modern-item time {
display: block;
margin-top: 8px;
color: var(--muted);
font-size: .82rem;
font-weight: 850
}

@media(max-width: 980px) {

.profile-modern-grid { grid-template-columns: 1fr }

.profile-side-column { grid-template-columns: 1fr 1fr }

.sticky-lite { position: static }

.profile-listing-grid { grid-template-columns: 1fr }
}

@media(max-width: 760px) {

.profile-hero-content {
grid-template-columns: 1fr;
padding-top: 108px
}

.profile-avatar-modern {
width: 126px;
height: 126px;
border-radius: 31px
}

.profile-avatar-modern img { border-radius: 25px }

.profile-stat-strip { grid-template-columns: repeat(2, minmax(0, 1fr)) }

.profile-side-column { grid-template-columns: 1fr }

.profile-modern-hero { border-radius: 30px }

.profile-section-card {
border-radius: 24px;
padding: 18px
}
}

@media(max-width: 520px) {

.profile-modern-wrap { padding-block: 26px 58px }

.profile-hero-content { padding-inline: 18px }

.profile-hero-actions .btn, .profile-hero-actions a { width: 100% }

.profile-hero-meta span {
width: 100%;
border-radius: 16px
}

.profile-stat-strip { grid-template-columns: 1fr }

.profile-listing-card { grid-template-columns: 1fr }

.profile-listing-icon {
width: 46px;
height: 46px
}

.review-modern-head { display: grid }
}

/* =========================================================
   LobbiLink unified public notifications and dialogs
   Keeps flash messages, form alerts and modal dialogs in the
   current modern design system.
   ========================================================= */
.flash-container {
position: fixed;
top: calc(var(--header-h, 82px) + 18px);
right: clamp(14px, 2.5vw, 28px);
z-index: 3000;
display: grid;
gap: 12px;
width: min(430px, calc(100vw - 28px));
pointer-events: none;
}

.flash {
position: relative;
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
padding: 14px 14px;
border: 1px solid rgba(230,237,245,.95);
border-radius: 22px;
background: rgba(255,255,255,.96);
color: var(--ink, #1c2430);/* box-shadow: 0 24px 70px rgba(14,42,71,.18); */
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
pointer-events: auto;
overflow: hidden;
animation: lobbiToastIn .28s cubic-bezier(.2, .8, .2, 1) both;
}

.flash:before {
content: "";
position: absolute;
left: 0;
top: 12px;
bottom: 12px;
width: 4px;
border-radius: 0 999px 999px 0;
background: var(--teal, #16B8A6);
}

.flash-icon {
width: 40px;
height: 40px;
border-radius: 16px;
display: grid;
place-items: center;
background: rgba(22,184,166,.12);
color: var(--teal, #16B8A6);
font-weight: 950;
flex: 0 0 auto;
}

.flash-icon .flat-icon, .flash-icon svg {
width: 20px;
height: 20px;
display: block;
}

.flash-message {
display: block;
min-width: 0;
color: var(--navy, #0E2A47);
font-weight: 850;
line-height: 1.35;
overflow-wrap: anywhere;
}

.flash-close, .alert-close, .modal-close, .dialog-close {
width: 34px;
height: 34px;
border: 0;
border-radius: 13px;
background: #f8fafc;
color: var(--muted, #64748b);
font-size: 22px;
line-height: 1;
display: grid;
place-items: center;
cursor: pointer;
padding: 0;
transition: background .18s ease, color .18s ease, transform .18s ease;
}

.flash-close:hover, .alert-close:hover, .modal-close:hover, .dialog-close:hover {
background: var(--navy, #0E2A47);
color: #fff;
transform: translateY(-1px);
}

.flash-success:before { background: var(--success, #10b981) }

.flash-success .flash-icon {
background: rgba(16,185,129,.13);
color: #047857
}

.flash-error:before { background: var(--danger, #ef4444) }

.flash-error .flash-icon {
background: rgba(239,68,68,.12);
color: #b91c1c
}

.flash-warning:before { background: var(--warning, #f59e0b) }

.flash-warning .flash-icon {
background: rgba(245,158,11,.14);
color: #a16207
}

.flash-info:before { background: var(--info, #3b82f6) }

.flash-info .flash-icon {
background: #eff6ff;
color: #1d4ed8
}

.flash.is-hiding, .alert.is-hiding { animation: lobbiToastOut .22s ease both; }
 @keyframes lobbiToastIn {
 from {
 opacity: 0;
 transform: translate3d(16px, -8px, 0) scale(.98)
}
 to {
 opacity: 1;
 transform: translate3d(0, 0, 0) scale(1)
}
}
 @keyframes lobbiToastOut {
 to {
 opacity: 0;
 transform: translate3d(16px, -8px, 0) scale(.98)
}
}

.alert {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
padding: 14px 14px 14px 16px;
border-radius: 18px;
margin: 14px 0;
font-weight: 850;
border: 1px solid var(--line, #e6edf5);
background: #fff;
box-shadow: 0 12px 36px rgba(14,42,71,.07);
}

.alert-success {
background: #ecfdf5;
color: #047857;
border-color: #bbf7d0
}

.alert-error, .alert-danger {
background: #fef2f2;
color: #b91c1c;
border-color: #fecaca
}

.alert-warning {
background: #fffbeb;
color: #92400e;
border-color: #fde68a
}

.alert-info {
background: #eff6ff;
color: #1d4ed8;
border-color: #bfdbfe
}

.modal-overlay, .dialog-overlay {
position: fixed;
inset: 0;
z-index: 3100;
display: none;
align-items: center;
justify-content: center;
padding: 18px;
background: rgba(14,42,71,.42);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}

.modal-overlay.active, .modal-overlay.is-active, .dialog-overlay.active, .dialog-overlay.is-active { display: flex; }

.modal, .dialog, .dialog-card {
width: min(560px, 100%);
border: 1px solid var(--line, #e6edf5);
border-radius: 30px;
background: #fff;
box-shadow: 0 34px 100px rgba(14,42,71,.28);
padding: 24px;
color: var(--ink, #1c2430);
}

.modal h2, .dialog h2, .dialog-card h2 {
margin: 0 0 8px;
color: var(--navy, #0E2A47);
letter-spacing: -.04em;
}

.modal p, .dialog p, .dialog-card p {
color: var(--muted, #64748b);
font-weight: 750;
}

.modal-actions, .dialog-actions {
display: flex;
justify-content: flex-end;
gap: 10px;
flex-wrap: wrap;
margin-top: 20px;
}

@media(max-width: 640px) {

.flash-container {
top: auto;
right: 14px;
bottom: 14px;
width: calc(100vw - 28px);
}

.flash {
border-radius: 20px;
padding: 13px
}

.flash-icon {
width: 36px;
height: 36px;
border-radius: 14px
}

.modal, .dialog, .dialog-card {
border-radius: 24px;
padding: 20px
}

.modal-actions, .dialog-actions {
display: grid;
grid-template-columns: 1fr
}

.modal-actions .btn, .dialog-actions .btn { width: 100% }
}

@media(prefers-reduced-motion:reduce) {

.flash, .flash.is-hiding, .alert.is-hiding { animation: none }
}

.video-gallery {
width: 100%;
max-width: 1180px;
margin: 34px auto 0;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
align-items: start;
}

.video-slide { width: 100%; }

.video-hover {
position: relative;
width: 100%;
overflow: hidden;
border-radius: 18px;
cursor: pointer;
background: #000;
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
}

.video-hover::before {
content: "";
display: block;
padding-top: 141.327%;
transition: padding-top 0.55s ease !important;
}

.video-hover:hover::before, .video-hover.is-playing::before { padding-top: 177.778%; }

.video-hover img, .video-hover video {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
transition: opacity 0.55s ease, transform 0.55s ease !important;
}

.video-hover img {
z-index: 1;
opacity: 1;
transform: scale(1);
}

.video-hover video {
z-index: 2;
opacity: 0;
transform: scale(1.04);
pointer-events: none;
}

.video-hover:hover img, .video-hover.is-playing img {
opacity: 0;
transform: scale(1.04);
}

.video-hover:hover video, .video-hover.is-playing video {
opacity: 1;
transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {

.video-gallery .video-hover::before { transition: padding-top 0.55s ease !important; }

.video-gallery .video-hover img, .video-gallery .video-hover video { transition: opacity 0.55s ease, transform 0.55s ease !important; }
}

@media (max-width: 900px) {

.video-gallery {
max-width: 760px;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (max-width: 600px) {

.video-gallery {
max-width: none;
height: 100svh;
overflow-y: auto;
display: flex;
flex-direction: column;
gap: 0;
scroll-snap-type: y mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
}

.video-slide {
min-height: 100svh;
width: 100%;
padding: 18px;
display: flex;
align-items: center;
justify-content: center;
scroll-snap-align: center;
scroll-snap-stop: always;
}

.video-hover {
width: min(100%, 430px);
max-height: calc(100svh - 36px);
border-radius: 20px;
}
}

/* === Reports and favourites patch === */
.dashboard-stats-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }

.stat-favourite .stat-icon-modern { background: linear-gradient(135deg, #ec4899, var(--coral)); }

.favourite-summary-modern > span { background: linear-gradient(135deg, #ec4899, var(--coral)); }

.favourite-summary-modern .btn { margin-left: auto; }

.favorite-btn.is-active, .favourite-btn.is-active {
border-color: rgba(236,72,153,.35);
background: rgba(236,72,153,.1);
color: #be185d;
}

.favorite-btn.is-loading, .favourite-btn.is-loading, .report-btn.is-loading {
opacity: .72;
pointer-events: none;
}

.favourites-modern-page { padding-block: 42px 76px; }

.favourites-heading {
max-width: 760px;
margin: 0 auto 24px;
}

.favourites-tabs {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
flex-wrap: wrap;
margin: 0 0 24px;
}

.tab-btn {
border: 1px solid var(--line);
border-radius: 999px;
background: #fff;
color: var(--navy);
font-weight: 950;
padding: 11px 18px;
cursor: pointer;
box-shadow: var(--shadow-xs);
transition: .2s var(--ease);
}

.tab-btn:hover, .tab-btn.active {
background: var(--navy);
color: #fff;
border-color: var(--navy);
}

.tab-btn .count {
display: inline-grid;
place-items: center;
min-width: 24px;
height: 24px;
margin-left: 6px;
border-radius: 999px;
background: rgba(22,184,166,.14);
color: currentColor;
font-size: .82rem;
}

.tab-content { display: none; }

.tab-content.active { display: block; }

.card-actions-row {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
margin-top: 14px;
}

.favourite-card[data-favourite-card] { transition: .22s var(--ease); }

.ll-modal-backdrop {
position: fixed;
inset: 0;
z-index: 9999;
display: grid;
place-items: center;
padding: 22px;
background: rgba(14,42,71,.48);
backdrop-filter: blur(8px);
animation: llFadeIn .16s ease-out;
}

.ll-modal-backdrop.is-closing { animation: llFadeOut .16s ease-out forwards; }

.ll-modal {
width: min(100%, 520px);
border-radius: 28px;
border: 1px solid var(--line);
background: #fff;
box-shadow: var(--shadow-lg);
padding: 24px;
}

.ll-modal-form { position: relative; }

.ll-modal h2 {
margin: 0 34px 8px 0;
color: var(--navy);
letter-spacing: -.04em;
}

.ll-modal p {
margin: 0 0 18px;
color: var(--muted);
font-weight: 700;
}

.ll-modal-close {
position: absolute;
right: 0;
top: 0;
width: 36px;
height: 36px;
border: 1px solid var(--line);
border-radius: 14px;
background: #f8fafc;
color: var(--navy);
font-size: 1.3rem;
line-height: 1;
cursor: pointer;
}

.ll-modal-actions {
display: flex;
justify-content: flex-end;
gap: 10px;
flex-wrap: wrap;
margin-top: 18px;
}
 @keyframes llFadeIn {
 from {
opacity: 0;
}
 to {
opacity: 1;
}
}
 @keyframes llFadeOut {
 from {
opacity: 1;
}
 to {
opacity: 0;
}
}

@media(max-width: 640px) {

.favourite-summary-modern { flex-wrap: wrap; }

.favourite-summary-modern .btn {
margin-left: 0;
width: 100%;
}

.ll-modal {
padding: 20px;
border-radius: 22px;
}

.ll-modal-actions .btn { width: 100%; }
}

@media(max-width: 820px) {

.dashboard-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media(max-width: 560px) {

.dashboard-stats-grid { grid-template-columns: 1fr; }
}

/* Dashboard linked stat cards */
a.dashboard-stat-card {
color: inherit;
text-decoration: none
}

a.dashboard-stat-card:hover { color: inherit }

/* Modern listing cards and media gallery */
.modern-listing-grid, .results-grid.modern-listing-grid, .owner-listing-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1.35rem;
}

.listing-card-modern {
position: relative;
overflow: hidden;
border: 1px solid rgba(148, 163, 184, .22);
border-radius: 28px;
background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96)), radial-gradient(circle at top right, rgba(20,184,166,.14), transparent 38%);
box-shadow: 0 22px 55px rgba(15, 23, 42, .08);
transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.listing-card-modern:hover {
transform: translateY(-4px);
border-color: rgba(20, 184, 166, .34);
box-shadow: 0 28px 70px rgba(15, 23, 42, .13);
}

.listing-card-modern .card-header, .listing-card-modern .offer-card-header, .listing-card-modern .request-card-header {
align-items: flex-start;
gap: .9rem;
}

.listing-card-modern h3 a {
color: inherit;
text-decoration: none;
}

.listing-card-media {
display: block;
height: 180px;
margin: -1.35rem -1.35rem 1.1rem;
overflow: hidden;
background: linear-gradient(135deg, rgba(20,184,166,.14), rgba(59,130,246,.12));
}

.listing-card-media img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transition: transform .35s ease;
}

.listing-card-modern:hover .listing-card-media img { transform: scale(1.045); }

.listing-card-icon {
width: 58px;
height: 58px;
border-radius: 20px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-bottom: 1rem;
color: var(--primary, #0f766e);
background: linear-gradient(135deg, rgba(20,184,166,.14), rgba(14,165,233,.12));
box-shadow: inset 0 0 0 1px rgba(20,184,166,.18);
}

.listing-card-icon svg {
width: 28px;
height: 28px;
}

.listing-card-modern .card-description, .listing-card-modern .offer-description, .listing-card-modern .request-description {
min-height: 3.4em;
color: var(--muted, #64748b);
}

.listing-card-modern .card-meta {
gap: .5rem;
flex-wrap: wrap;
}

.listing-card-modern .card-meta span, .listing-card-modern .profile-listing-meta span {
border-radius: 999px;
background: rgba(15, 23, 42, .04);
padding: .42rem .72rem;
}

.listing-card-modern .card-actions-row, .owner-listing-grid .card-actions-row {
display: flex;
align-items: center;
gap: .55rem;
flex-wrap: wrap;
margin-top: 1rem;
}

.inline-form {
display: inline-flex;
margin: 0;
}

.listing-media-gallery {
display: grid;
 grid-template-columns: 1.4fr repeat(2, minmax(140px, .8fr));
gap: .9rem;
margin: 1.4rem 0 2rem;
}

.listing-gallery-item {
position: relative;
min-height: 190px;
overflow: hidden;
border-radius: 26px;
border: 1px solid rgba(148, 163, 184, .22);
box-shadow: 0 18px 48px rgba(15, 23, 42, .10);
background: #f1f5f9;
}

.listing-gallery-item.is-main {
grid-row: span 2;
min-height: 390px;
}

.listing-gallery-item img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transition: transform .35s ease;
}

.listing-gallery-item:hover img { transform: scale(1.04); }

.share-btn.is-copied {
pointer-events: none;
box-shadow: 0 0 0 4px rgba(20,184,166,.14);
}

.profile-listing-card.listing-card-modern.has-media { padding: 1.1rem; }

.profile-listing-card.listing-card-modern .listing-card-media {
height: 150px;
margin: 0 0 1rem;
border-radius: 22px;
}

@media (max-width: 860px) {

.listing-media-gallery { grid-template-columns: 1fr; }

.listing-gallery-item, .listing-gallery-item.is-main {
min-height: 240px;
grid-row: auto;
}
}

@media (max-width: 560px) {

.modern-listing-grid, .results-grid.modern-listing-grid, .owner-listing-grid { grid-template-columns: 1fr; }

.listing-card-media { height: 160px; }
}

/* Stays page modern refresh */
.stays-modern-page { padding-block: 42px 78px }

.stays-heading {
align-items: center;
margin-bottom: 20px
}

.stays-heading h1 {
font-size: clamp(2.15rem, 5vw, 4.1rem);
margin: 0;
color: var(--navy);
letter-spacing: -.065em;
line-height: 1.02
}

.stays-heading p { max-width: 680px }

.stays-usage-card {
margin: 0 0 22px;
max-width: 680px
}

.user-stays-grid { margin-top: 20px }

.stay-card-modern {
position: relative;
overflow: hidden;
background: linear-gradient(180deg, #fff, #fbfdff);
border: 1px solid var(--line);
border-radius: 30px;
padding: 22px;
box-shadow: var(--shadow-sm);
transition: .22s var(--ease);
min-height: 295px;
display: flex;
flex-direction: column;
gap: 14px;
}

.stay-card-modern:before {
content: "";
position: absolute;
inset: 0 0 auto;
height: 7px;
background: linear-gradient(90deg, var(--teal), var(--coral));
opacity: .9;
}

.stay-card-modern:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-md)
}

.stay-card-topline {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding-top: 6px
}

.stay-card-icon {
width: 52px;
height: 52px;
border-radius: 19px;
display: grid;
place-items: center;
background: linear-gradient(135deg, rgba(22,184,166,.16), rgba(255,122,89,.14));
color: var(--navy);
flex: 0 0 auto;
}

.stay-card-icon .flat-icon {
width: 25px;
height: 25px
}

.stay-card-modern h3 {
margin: 0;
color: var(--navy);
font-size: 1.28rem;
line-height: 1.2;
letter-spacing: -.035em
}

.stay-card-modern h3 a {
color: inherit;
text-decoration: none
}

.stay-card-modern h3 a:hover { color: var(--teal-2) }

.stay-accommodation-name {
margin: -6px 0 0;
color: var(--muted);
font-weight: 850
}

.stay-meta-modern {
gap: 9px;
margin-top: 0;
padding-top: 0
}

.stay-meta-modern span {
display: inline-flex;
align-items: center;
gap: 6px;
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 999px;
padding: 7px 10px
}

.stay-card-note {
color: var(--muted);
margin: 0;
line-height: 1.62
}

.stay-actions-modern {
margin-top: auto;
justify-content: flex-start
}

.stay-actions-modern form {
display: inline-flex;
margin: 0
}

.stay-detail-v2 .status-stay, .status-stay {
background: rgba(22,184,166,.13);
color: var(--teal-2);
border-color: rgba(22,184,166,.24)
}

.stay-side-card { background: radial-gradient(circle at 18% 0, rgba(22,184,166,.22), transparent 36%), linear-gradient(135deg, var(--navy), #12385f) }

.stay-content-grid { margin-top: 22px }

.info-grid-modern {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}

.info-grid-modern > div {
background: #f8fafc;
border: 1px solid var(--line);
border-radius: 18px;
padding: 14px;
}

.info-grid-modern span, .owner-card-modern span {
display: block;
color: var(--muted);
font-weight: 900;
font-size: .86rem
}

.info-grid-modern strong, .owner-card-modern strong {
display: block;
color: var(--navy);
font-weight: 950;
margin-top: 4px
}

.owner-card-modern {
background: #fff;
border: 1px solid var(--line);
border-radius: 26px;
padding: 20px;
box-shadow: var(--shadow-sm);
display: flex;
gap: 14px;
height: max-content;
}

.owner-avatar {
width: 58px;
height: 58px;
border-radius: 20px;
display: grid!important;
place-items: center;
overflow: hidden;
background: #f8fafc;
color: var(--navy);
flex: 0 0 auto
}

.owner-avatar img {
width: 100%;
height: 100%;
object-fit: cover
}

.owner-avatar .flat-icon {
width: 26px;
height: 26px
}

.owner-card-modern small {
display: inline-flex;
margin-top: 7px;
color: var(--teal-2);
font-weight: 950
}

@media(max-width: 820px) {

.stays-heading { display: block }

.stays-heading .btn { margin-top: 16px }

.info-grid-modern { grid-template-columns: 1fr }
}

/* Property-style offer detail page */
.offer-property-hero { margin: 1.25rem 0 1.05rem; }

.offer-property-media-card {
position: relative;
overflow: hidden;
min-height: clamp(360px, 54vw, 610px);
border-radius: 34px;
background: linear-gradient(135deg, rgba(22,184,166,.18), rgba(15,23,42,.08));
box-shadow: 0 30px 80px rgba(15,23,42,.18);
isolation: isolate;
}

.offer-property-media-card.no-user-photo { background: radial-gradient(circle at 20% 20%, rgba(20,184,166,.22), transparent 34%), linear-gradient(135deg, #eef8f8, #f8fafc); }

.offer-property-main-image {
position: absolute;
inset: 0;
display: block;
}

.offer-property-main-image img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transform: scale(1.001);
}

.offer-property-gradient {
position: absolute;
inset: 0;
z-index: 1;
background: linear-gradient(180deg, rgba(15,23,42,.08) 0%, rgba(15,23,42,.28) 42%, rgba(15,23,42,.72) 100%);
pointer-events: none;
}

.offer-property-overlay {
position: absolute;
left: clamp(22px, 4vw, 54px);
right: clamp(22px, 4vw, 54px);
bottom: clamp(24px, 4vw, 52px);
z-index: 2;
color: #fff;
max-width: 860px;
}

.offer-property-overlay .detail-kicker-row { margin-bottom: 14px; }

.offer-property-overlay .badge, .offer-property-overlay .status-badge {
background: rgba(255,255,255,.92);
border-color: rgba(255,255,255,.45);
color: var(--navy, #0f172a);
backdrop-filter: blur(12px);
}

.offer-property-overlay h1 {
margin: 0;
color: #fff;
font-size: clamp(2.15rem, 5vw, 4.8rem);
letter-spacing: -.065em;
line-height: .98;
text-shadow: 0 10px 32px rgba(15,23,42,.35);
}

.offer-property-overlay p {
margin: 14px 0 0;
color: rgba(255,255,255,.9);
font-weight: 900;
font-size: 1.06rem;
}

.offer-property-thumbs {
position: absolute;
right: clamp(18px, 3vw, 34px);
bottom: clamp(18px, 3vw, 34px);
z-index: 3;
display: grid;
grid-template-columns: repeat(3, 78px);
gap: 10px;
}

.offer-property-thumbs a {
width: 78px;
height: 64px;
overflow: hidden;
border-radius: 16px;
border: 2px solid rgba(255,255,255,.78);
background: rgba(255,255,255,.15);
box-shadow: 0 12px 30px rgba(15,23,42,.2);
text-decoration: none;
}

.offer-property-thumbs img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
transition: transform .25s ease;
}

.offer-property-thumbs a:hover img { transform: scale(1.06); }

.offer-property-thumbs .thumb-more {
display: grid;
place-items: center;
color: #fff;
font-weight: 950;
background: rgba(15,23,42,.56);
backdrop-filter: blur(10px);
}

.offer-property-summary-card {
margin-top: 0;
align-items: stretch;
}

.property-price-card {
position: sticky;
top: 96px;
}

.detail-sidebar-v2 {
position: sticky;
top: 96px;
align-self: start;
}

.photo-plan-note {
padding: 12px 14px;
border: 1px solid rgba(20,184,166,.22);
border-radius: 16px;
background: rgba(20,184,166,.08);
color: var(--navy, #0f172a);
font-weight: 850;
margin-bottom: 16px;
}

.editable-photo-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 12px;
}

.editable-photo-item {
display: block;
border: 1px solid var(--line, #e2e8f0);
border-radius: 18px;
padding: 10px;
background: #fff;
box-shadow: 0 10px 24px rgba(15,23,42,.06);
}

.editable-photo-item img {
width: 100%;
height: 116px;
object-fit: cover;
border-radius: 14px;
display: block;
margin-bottom: 9px;
}

.editable-photo-item span, .editable-photo-item em {
display: block;
font-size: .86rem;
font-weight: 900;
color: var(--muted, #64748b);
font-style: normal;
}

.editable-photo-item em {
margin-top: 6px;
color: var(--navy, #0f172a);
}

@media (max-width: 960px) {

.offer-property-thumbs {
position: relative;
right: auto;
bottom: auto;
padding: 0 18px 18px;
grid-template-columns: repeat(5, minmax(0, 1fr));
margin-top: -92px;
}

.offer-property-thumbs a { width: 100%; }

.offer-property-overlay { bottom: 118px; }

.property-price-card, .detail-sidebar-v2 { position: static; }
}

@media (max-width: 640px) {

.offer-property-media-card {
border-radius: 24px;
min-height: 430px;
}

.offer-property-overlay {
bottom: 104px;
left: 18px;
right: 18px;
}

.offer-property-thumbs {
grid-template-columns: repeat(3, 1fr);
margin-top: -86px;
}
}

/* Listing image lightbox */
.lightbox-hidden-items { display: none !important; }

body.lightbox-open { overflow: hidden; }

.ll-lightbox-backdrop {
position: fixed;
inset: 0;
z-index: 9999;
display: grid;
place-items: center;
padding: clamp(16px, 3vw, 36px);
background: rgba(8, 15, 28, .86);
backdrop-filter: blur(14px);
animation: llLightboxFade .18s ease both;
}

.ll-lightbox-backdrop.is-closing { animation: llLightboxFadeOut .17s ease both; }

.ll-lightbox {
position: relative;
width: min(1180px, 100%);
max-height: calc(100vh - 48px);
display: grid;
place-items: center;
}

.ll-lightbox-figure {
margin: 0;
width: 100%;
display: grid;
gap: 14px;
justify-items: center;
}

.ll-lightbox-image {
max-width: 100%;
max-height: calc(100vh - 150px);
display: block;
object-fit: contain;
border-radius: 24px;
box-shadow: 0 34px 110px rgba(0, 0, 0, .42);
background: #0f172a;
}

.ll-lightbox-figure figcaption {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
flex-wrap: wrap;
color: rgba(255,255,255,.92);
text-align: center;
font-weight: 850;
}

.ll-lightbox-counter {
color: rgba(255,255,255,.72);
font-size: .92rem;
}

.ll-lightbox-close, .ll-lightbox-nav {
appearance: none;
border: 1px solid rgba(255,255,255,.22);
background: rgba(255,255,255,.12);
color: #fff;
cursor: pointer;
box-shadow: 0 14px 40px rgba(0,0,0,.28);
backdrop-filter: blur(12px);
transition: transform .18s ease, background .18s ease, border-color .18s ease;
}

.ll-lightbox-close:hover, .ll-lightbox-nav:hover {
transform: translateY(-1px);
background: rgba(255,255,255,.2);
border-color: rgba(255,255,255,.36);
}

.ll-lightbox-close {
position: absolute;
top: -8px;
right: -8px;
z-index: 2;
width: 46px;
height: 46px;
border-radius: 16px;
font-size: 2rem;
line-height: 1;
}

.ll-lightbox-nav {
position: absolute;
top: 50%;
z-index: 2;
width: 54px;
height: 70px;
border-radius: 20px;
font-size: 3rem;
line-height: 1;
transform: translateY(-50%);
}

.ll-lightbox-nav:hover { transform: translateY(calc(-50% - 1px)); }

.ll-lightbox-prev { left: -18px; }

.ll-lightbox-next { right: -18px; }

.js-lightbox-trigger { cursor: zoom-in; }
 @keyframes llLightboxFade {
 from {
opacity: 0;
}
 to {
opacity: 1;
}
}
 @keyframes llLightboxFadeOut {
 from {
opacity: 1;
}
 to {
opacity: 0;
}
}

@media (max-width: 760px) {

.ll-lightbox-backdrop { padding: 12px; }

.ll-lightbox-image {
max-height: calc(100vh - 132px);
border-radius: 18px;
}

.ll-lightbox-close {
top: 6px;
right: 6px;
}

.ll-lightbox-nav {
width: 44px;
height: 58px;
border-radius: 16px;
font-size: 2.4rem;
}

.ll-lightbox-prev { left: 4px; }

.ll-lightbox-next { right: 4px; }
}

/* Offer detail vertical property layout */
.offer-property-intro-card {
position: relative;
overflow: hidden;
margin: 0 0 1.1rem;
padding: clamp(24px, 4vw, 44px);
border: 1px solid rgba(148, 163, 184, .22);
border-radius: 34px;
background: radial-gradient(circle at 92% 0, rgba(255,122,89,.16), transparent 34%), linear-gradient(135deg, rgba(255,255,255,.98), rgba(22,184,166,.08));
box-shadow: 0 24px 70px rgba(15, 23, 42, .08);
}

.offer-property-intro-card .detail-kicker-row { margin-bottom: 1rem; }

.offer-property-intro-card h1 {
max-width: 960px;
margin: 0;
color: var(--navy, #0f172a);
font-size: clamp(2.15rem, 5vw, 4.55rem);
line-height: .98;
letter-spacing: -.07em;
}

.offer-property-meta-line {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: .65rem;
margin-top: 1.15rem;
}

.offer-property-meta-line span {
display: inline-flex;
align-items: center;
gap: .45rem;
border: 1px solid rgba(148, 163, 184, .26);
border-radius: 999px;
padding: .62rem .88rem;
background: rgba(255, 255, 255, .82);
color: var(--navy, #0f172a);
font-weight: 900;
box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
}

.offer-property-gallery-section { margin: 0 0 1.1rem; }

.offer-property-media-card-clean {
min-height: clamp(360px, 50vw, 560px);
border: 1px solid rgba(148, 163, 184, .22);
box-shadow: 0 26px 76px rgba(15, 23, 42, .13);
}

.offer-property-media-card-clean:after {
content: "";
position: absolute;
inset: auto 0 0;
height: 36%;
background: linear-gradient(180deg, transparent, rgba(15, 23, 42, .42));
pointer-events: none;
z-index: 1;
}

.offer-property-media-card-clean .offer-property-thumbs {
bottom: clamp(18px, 3vw, 30px);
z-index: 2;
}

.offer-property-actions-card {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
gap: 1.2rem;
align-items: stretch;
margin: 0 0 1.35rem;
}

.offer-property-actions-main {
display: flex;
flex-direction: column;
justify-content: center;
gap: 1rem;
padding: clamp(20px, 3vw, 30px);
border: 1px solid rgba(148, 163, 184, .22);
border-radius: 28px;
background: #fff;
box-shadow: 0 18px 46px rgba(15, 23, 42, .07);
}

.offer-property-actions-main .detail-actions-row { margin-top: 0; }

.offer-property-actions-main .detail-lead {
margin: 0;
max-width: 900px;
}

.offer-description-parameters-grid { align-items: start; }

.offer-parameters-grid { margin-top: 1.25rem; }

@media (max-width: 960px) {

.offer-property-actions-card { grid-template-columns: 1fr; }

.offer-property-media-card-clean .offer-property-thumbs { z-index: 3; }
}

@media (max-width: 640px) {

.offer-property-intro-card {
border-radius: 24px;
padding: 22px;
}

.offer-property-meta-line span {
width: 100%;
justify-content: flex-start;
}

.offer-property-actions-main { border-radius: 22px; }
}

/* Domus-inspired offer detail layout */
.domus-offer-title-block {
max-width: 1180px;
margin: 0 auto 1.15rem;
padding: .35rem 0 .15rem;
}

.domus-kicker-row { margin-bottom: .9rem; }

.domus-offer-title-block h1 {
max-width: 980px;
margin: 0;
color: var(--navy, #0f172a);
font-size: clamp(2.4rem, 4vw, 4rem);
line-height: .94;
letter-spacing: -.078em;
}

.domus-offer-meta-line {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: .55rem 1.05rem;
margin-top: 1rem;
color: #465569;
font-weight: 850;
}

.domus-offer-meta-line span {
display: inline-flex;
align-items: center;
gap: .48rem;
}

.domus-offer-gallery-section {
max-width: 1180px;
margin: .75rem auto 1.1rem;
}

.domus-gallery-grid {
display: grid;
grid-template-columns: 1fr;
gap: .72rem;
padding: .72rem;
overflow: hidden;
border-radius: 28px;
background: #ffffff;
border: 1px solid rgba(148, 163, 184, .26);
box-shadow: 0 18px 46px rgba(15, 23, 42, .11);
}

.domus-gallery-main, .domus-gallery-thumb {
position: relative;
display: block;
overflow: hidden;
background: #e2e8f0;
text-decoration: none;
color: #fff;
}

.domus-gallery-main {
height: clamp(330px, 42vw, 510px);
border-radius: 22px;
}

.domus-gallery-main img, .domus-gallery-thumb img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transition: transform .35s ease, filter .35s ease;
}

.domus-gallery-main:hover img, .domus-gallery-thumb:hover img {
transform: scale(1.035);
filter: saturate(1.04);
}

.domus-gallery-placeholder img {
object-fit: cover;
opacity: .86;
}

.domus-gallery-thumbs {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: .62rem;
}

.domus-gallery-thumb {
height: 92px;
border-radius: 18px;
border: 1px solid rgba(148, 163, 184, .24);
box-shadow: 0 10px 26px rgba(15, 23, 42, .09);
}

.domus-gallery-thumb span, .domus-gallery-thumb em {
position: absolute;
inset: 0;
display: grid;
place-items: center;
padding: .65rem;
background: rgba(15, 23, 42, .58);
color: #fff;
text-align: center;
font-size: .82rem;
font-weight: 950;
font-style: normal;
letter-spacing: -.01em;
backdrop-filter: blur(4px);
}

.domus-gallery-empty .domus-gallery-main, .domus-gallery-images-1 .domus-gallery-main { height: clamp(200px, 30vw, 400px); }

.domus-offer-action-strip {
max-width: 1180px;
margin: 0 auto 1.25rem;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 1rem;
border: 1px solid rgba(148, 163, 184, .28);
border-radius: 24px;
background: rgba(255, 255, 255, .96);
box-shadow: 0 16px 40px rgba(15, 23, 42, .07);
}

.domus-offer-price-summary {
display: grid;
gap: .1rem;
min-width: 190px;
}

.domus-offer-price-summary span, .domus-contact-price span, .domus-provider-head label, .domus-stay-card-inline label {
color: var(--muted, #64748b);
font-size: .76rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .08em;
}

.domus-offer-price-summary strong, .domus-contact-price strong {
color: var(--navy, #0f172a);
font-size: clamp(1.35rem, 2.6vw, 2rem);
font-weight: 950;
letter-spacing: -.04em;
}

.domus-offer-price-summary small, .domus-contact-price small {
color: #64748b;
font-weight: 850;
}

.domus-offer-buttons {
justify-content: flex-end;
margin: 0;
}

.domus-offer-content-grid {
max-width: 1180px;
margin: 0 auto;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
gap: 1.35rem;
align-items: start;
}

.domus-offer-content-card, .domus-sidebar-card {
border: 1px solid rgba(148, 163, 184, .24);
border-radius: 28px;
background: rgba(255, 255, 255, .97);
box-shadow: 0 18px 48px rgba(15, 23, 42, .07);
}

.domus-offer-content-card { padding: clamp(22px, 4vw, 38px); }

.domus-section-heading { margin-bottom: 1.05rem; }

.domus-section-heading h2 {
margin: .12rem 0 0;
color: var(--navy, #0f172a);
font-size: clamp(1.55rem, 3vw, 2.28rem);
line-height: 1.02;
letter-spacing: -.052em;
}

.domus-section-heading-spaced { margin-top: 2rem; }

.domus-description-box {
max-width: 820px;
margin-bottom: 0;
color: #334155;
font-size: 1.05rem;
line-height: 1.78;
}

.domus-description-box p:first-child { margin-top: 0; }

.domus-parameters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.domus-parameters-grid .info-tile {
border-radius: 18px;
background: #f8fafc;
}

.domus-stay-card-inline {
display: grid;
grid-template-columns: 52px minmax(0, 1fr);
gap: 1rem;
margin-top: 1.25rem;
padding: 1.1rem;
border-radius: 22px;
background: linear-gradient(135deg, rgba(20, 184, 166, .11), rgba(255, 122, 89, .08));
border: 1px solid rgba(20, 184, 166, .18);
}

.domus-stay-card-inline > span {
width: 52px;
height: 52px;
display: grid;
place-items: center;
border-radius: 18px;
background: #fff;
color: var(--teal, #14b8a6);
box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
}

.domus-stay-card-inline strong {
display: block;
color: var(--navy, #0f172a);
font-weight: 950;
font-size: 1.06rem;
margin-top: .1rem;
}

.domus-stay-card-inline p, .domus-stay-card-inline small {
display: block;
margin: .18rem 0 0;
color: #64748b;
font-weight: 850;
}

.domus-offer-sidebar {
position: sticky;
top: 96px;
}

.domus-contact-card { padding: 1.2rem; }

.domus-contact-price {
display: grid;
gap: .15rem;
padding: 1.05rem;
border-radius: 22px;
background: linear-gradient(135deg, rgba(20, 184, 166, .12), rgba(255,255,255,.92));
border: 1px solid rgba(20, 184, 166, .18);
margin-bottom: 1rem;
}

.domus-provider-head {
align-items: center;
padding: 0;
}

.domus-provider-head img {
width: 64px;
height: 64px;
border-radius: 20px;
object-fit: cover;
box-shadow: 0 12px 28px rgba(15, 23, 42, .12);
}

.domus-provider-head h3 {
margin: .12rem 0 .15rem;
color: var(--navy, #0f172a);
font-size: 1.2rem;
letter-spacing: -.03em;
}

.domus-provider-head p, .domus-contact-card .profile-mini-bio {
margin: 0;
color: #64748b;
font-weight: 800;
}

.domus-contact-card .profile-mini-bio {
margin-top: 1rem;
line-height: 1.6;
}

.domus-sidebar-actions {
display: grid;
gap: .7rem;
margin-top: 1rem;
}

.btn-full {
width: 100%;
justify-content: center;
}

@media (max-width: 1040px) {

.domus-gallery-main { height: clamp(310px, 50vw, 470px); }

.domus-gallery-thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.domus-offer-action-strip, .domus-offer-content-grid { grid-template-columns: 1fr; }

.domus-offer-content-grid { display: block; }

.domus-offer-sidebar {
position: static;
margin-top: 1.25rem;
}
}

@media (max-width: 780px) {

.domus-offer-action-strip {
align-items: stretch;
flex-direction: column;
}

.domus-offer-buttons {
justify-content: flex-start;
width: 100%;
}

.domus-offer-buttons .btn { flex: 1 1 auto; }

.domus-parameters-grid { grid-template-columns: 1fr; }

.domus-gallery-thumbs { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.domus-gallery-thumb { height: 86px; }
}

@media (max-width: 560px) {

.domus-offer-title-block h1 { font-size: clamp(2.1rem, 14vw, 3.2rem); }

.domus-gallery-grid {
border-radius: 22px;
gap: .5rem;
padding: .5rem;
}

.domus-gallery-main {
height: 280px;
border-radius: 18px;
}

.domus-gallery-thumbs {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: .5rem;
}

.domus-gallery-thumb {
height: 82px;
border-radius: 15px;
}

.domus-offer-content-card, .domus-sidebar-card, .domus-offer-action-strip { border-radius: 22px; }
}

/* Offer detail sidebar contact form */
.domus-inline-contact-form {
display: grid;
gap: .85rem;
margin-top: 1.05rem;
padding: 1rem;
border-radius: 22px;
border: 1px solid rgba(20, 184, 166, .18);
background: linear-gradient(135deg, rgba(20, 184, 166, .10), rgba(255, 255, 255, .94));
}

.domus-inline-contact-head h4 {
margin: 0 0 .28rem;
color: var(--navy, #0f172a);
font-size: 1rem;
line-height: 1.2;
font-weight: 950;
letter-spacing: -.025em;
}

.domus-inline-contact-head p {
margin: 0;
color: #64748b;
font-size: .9rem;
line-height: 1.5;
font-weight: 750;
}

.domus-inline-contact-form textarea {
width: 100%;
min-height: 112px;
resize: vertical;
border: 1px solid rgba(148, 163, 184, .35);
border-radius: 18px;
padding: .9rem .95rem;
background: rgba(255, 255, 255, .96);
color: var(--navy, #0f172a);
font: inherit;
font-weight: 750;
line-height: 1.55;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.domus-inline-contact-form textarea:focus {
outline: none;
border-color: rgba(20, 184, 166, .75);
background: #fff;
box-shadow: 0 0 0 4px rgba(20, 184, 166, .13);
}

.domus-inline-contact-login { background: linear-gradient(135deg, rgba(14, 42, 71, .08), rgba(20, 184, 166, .08)); }

/* Social share popover */
.share-btn.is-open { box-shadow: 0 0 0 4px rgba(14, 165, 233, .16); }

.share-popover {
position: absolute;
z-index: 1200;
background: rgba(255, 255, 255, .98);
border: 1px solid rgba(148, 163, 184, .28);
border-radius: 22px;
box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
padding: .95rem;
backdrop-filter: blur(18px);
}

.share-popover::before {
content: '';
position: absolute;
top: -7px;
left: 26px;
width: 14px;
height: 14px;
background: rgba(255, 255, 255, .98);
border-left: 1px solid rgba(148, 163, 184, .28);
border-top: 1px solid rgba(148, 163, 184, .28);
transform: rotate(45deg);
}

.share-popover-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: .75rem;
margin-bottom: .8rem;
}

.share-popover-head strong {
font-size: .9rem;
color: #0f172a;
}

.share-popover-close {
width: 30px;
height: 30px;
border: 0;
border-radius: 999px;
background: #f1f5f9;
color: #334155;
font-size: 1.25rem;
line-height: 1;
cursor: pointer;
}

.share-popover-close:hover { background: #e2e8f0; }

.share-popover-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: .55rem;
}

.share-popover-link {
display: flex;
align-items: center;
justify-content: center;
min-height: 42px;
padding: .65rem .7rem;
border-radius: 14px;
text-decoration: none;
font-size: .88rem;
font-weight: 800;
border: 1px solid rgba(148, 163, 184, .22);
background: #f8fafc;
color: #0f172a;
transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.share-popover-link:hover {
transform: translateY(-1px);
box-shadow: 0 12px 24px rgba(15, 23, 42, .12);
border-color: rgba(20, 184, 166, .4);
}

.share-popover-facebook { color: #1877f2; }

.share-popover-x { color: #111827; }

.share-popover-pinterest { color: #bd081c; }

.share-popover-email { color: #0f766e; }

.share-popover-viber { color: #7360f2; }

@media (max-width: 640px) {

.share-popover {
position: fixed;
left: 12px !important;
right: 12px;
top: auto !important;
bottom: 14px;
width: auto !important;
}

.share-popover::before { display: none; }
}

/* Modern contact page */
.contact-modern-page { padding-bottom: 86px; }

.contact-hero-modern {
position: relative;
overflow: hidden;
padding: clamp(46px, 7vw, 92px) 0 clamp(28px, 5vw, 58px);
}

.contact-hero-modern:before {
content: "";
position: absolute;
inset: 0;
background: radial-gradient(circle at 12% 8%, rgba(255,122,89,.20), transparent 32rem), radial-gradient(circle at 88% 18%, rgba(22,184,166,.22), transparent 34rem);
pointer-events: none;
}

.contact-hero-grid {
position: relative;
display: grid;
 grid-template-columns: minmax(0, 1.2fr) minmax(300px, .56fr);
gap: clamp(22px, 4vw, 52px);
align-items: stretch;
}

.contact-hero-copy {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 330px;
}

.contact-hero-copy h1 {
max-width: 800px;
margin: 10px 0 18px;
font-size: clamp(2.3rem, 4vw, 3rem);
line-height: .96;
letter-spacing: -.075em;
color: var(--navy);
}

.contact-hero-copy p {
max-width: 720px;
margin: 0;
color: var(--muted);
font-size: clamp(1.05rem, 2vw, 1.28rem);
font-weight: 650;
}

.contact-trust-row {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 28px;
}

.contact-trust-row span {
display: inline-flex;
align-items: center;
gap: 7px;
padding: 10px 13px;
border: 1px solid rgba(22,184,166,.22);
border-radius: 999px;
background: rgba(255,255,255,.72);
color: var(--navy);
font-weight: 900;
box-shadow: var(--shadow-xs);
}

.contact-hero-panel, .contact-form-card-modern, .contact-card-modern {
background: rgba(255,255,255,.86);
border: 1px solid rgba(230,237,245,.92);
box-shadow: var(--shadow-sm);
backdrop-filter: blur(18px);
}

.contact-hero-panel {
align-self: center;
border-radius: 34px;
padding: clamp(24px, 3vw, 34px);
min-height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
overflow: hidden;
}

.contact-hero-panel:after {
content: "";
position: absolute;
width: 160px;
height: 160px;
right: -48px;
bottom: -54px;
border-radius: 50%;
background: linear-gradient(135deg, rgba(22,184,166,.22), rgba(255,122,89,.18));
}

.contact-panel-icon, .contact-card-icon {
width: 58px;
height: 58px;
display: grid;
place-items: center;
border-radius: 22px;
background: linear-gradient(135deg, rgba(22,184,166,.16), rgba(255,122,89,.14));
color: var(--navy);
flex: 0 0 auto;
}

.contact-panel-icon .flat-icon, .contact-card-icon .flat-icon {
width: 28px;
height: 28px;
}

.contact-hero-panel h2 {
margin: 18px 0 8px;
color: var(--navy);
font-size: 1.55rem;
letter-spacing: -.04em;
}

.contact-hero-panel p {
margin: 0;
color: var(--muted);
font-weight: 750;
}

.contact-email-pill {
position: relative;
z-index: 1;
display: inline-flex;
width: fit-content;
margin-top: 22px;
padding: 11px 14px;
border-radius: 999px;
background: var(--navy);
color: #fff;
font-weight: 950;
box-shadow: var(--shadow-sm);
}

.contact-modern-content { position: relative; }

.contact-main-grid {
display: grid;
 grid-template-columns: minmax(260px, .42fr) minmax(0, .58fr);
gap: clamp(18px, 3vw, 32px);
align-items: start;
}

.contact-info-stack {
display: grid;
gap: 14px;
position: sticky;
top: calc(var(--header-h) + 22px);
}

.contact-card-modern {
border-radius: 28px;
padding: 20px;
display: flex;
gap: 14px;
align-items: flex-start;
}

.contact-card-modern.is-highlight {
background: linear-gradient(135deg, var(--navy), #12385f);
border-color: rgba(14,42,71,.16);
color: #fff;
}

.contact-card-modern.is-highlight .contact-card-icon {
background: rgba(255,255,255,.13);
color: #fff;
}

.contact-card-modern h3 {
margin: 0 0 4px;
color: var(--navy);
font-size: 1.02rem;
letter-spacing: -.025em;
}

.contact-card-modern.is-highlight h3 { color: #fff; }

.contact-card-modern p {
margin: 0;
color: var(--muted);
font-size: .95rem;
font-weight: 700;
line-height: 1.55;
}

.contact-card-modern.is-highlight p { color: rgba(255,255,255,.78); }

.contact-form-card-modern {
border-radius: 34px;
padding: clamp(22px, 3.4vw, 40px);
}

.contact-form-head { margin-bottom: 22px; }

.contact-form-head h2 {
margin: 8px 0 8px;
color: var(--navy);
font-size: clamp(1.7rem, 3vw, 2.5rem);
letter-spacing: -.055em;
line-height: 1.03;
}

.contact-form-head p {
max-width: 620px;
margin: 0;
color: var(--muted);
font-weight: 750;
}

.contact-form-modern {
display: grid;
gap: 16px;
}

.contact-form-modern .form-row.two-cols {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}

.contact-form-modern label {
color: var(--navy);
font-weight: 950;
}

.contact-form-modern .form-control {
width: 100%;
border: 1px solid rgba(148,163,184,.28);
border-radius: 18px;
background: #fff;
padding: 13px 15px;
color: var(--ink);
box-shadow: 0 1px 0 rgba(15,23,42,.02);
transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.contact-form-modern textarea.form-control {
min-height: 180px;
resize: vertical;
}

.contact-form-modern .form-control:focus {
outline: none;
border-color: rgba(22,184,166,.62);
box-shadow: 0 0 0 4px rgba(22,184,166,.13);
}

.contact-submit-btn {
width: fit-content;
margin-top: 4px;
display: inline-flex;
align-items: center;
gap: 8px;
}

@media (max-width: 980px) {

.contact-hero-grid, .contact-main-grid { grid-template-columns: 1fr; }

.contact-hero-copy { min-height: auto; }

.contact-info-stack {
position: static;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (max-width: 640px) {

.contact-modern-page { padding-bottom: 58px; }

.contact-hero-modern { padding-top: 34px; }

.contact-trust-row, .contact-info-stack, .contact-form-modern .form-row.two-cols { grid-template-columns: 1fr; }

.contact-trust-row { display: grid; }

.contact-card-modern { padding: 17px; }

.contact-submit-btn {
width: 100%;
justify-content: center;
}
}

/* FAQ page and contact FAQ section */
.faq-page-wrap { max-width: 1180px; }

.content-page-hero.faq-page-hero {
position: relative;
overflow: hidden;
margin: 1rem 0 2rem;
padding: clamp(2.25rem, 5vw, 4.5rem);
border-radius: 32px;
background: linear-gradient(135deg, rgba(14, 165, 233, 0.12), rgba(99, 102, 241, 0.14)), #ffffff;
border: 1px solid rgba(148, 163, 184, 0.22);
box-shadow: 0 24px 70px rgba(15, 23, 42, 0.08);
}

.content-page-hero.faq-page-hero:after {
content: '';
position: absolute;
inset: auto -8rem -10rem auto;
width: 24rem;
height: 24rem;
border-radius: 999px;
background: radial-gradient(circle, rgba(14, 165, 233, 0.22), rgba(14, 165, 233, 0));
pointer-events: none;
}

.faq-page-hero h1 {
margin: .6rem 0 1rem;
max-width: 820px;
font-size: clamp(2.25rem, 5vw, 4.5rem);
line-height: .96;
letter-spacing: -.055em;
color: #0f172a;
}

.faq-page-hero p {
max-width: 760px;
margin: 0;
color: #475569;
font-size: 1.08rem;
line-height: 1.8;
}

.faq-page-layout {
display: grid;
grid-template-columns: minmax(0, 1fr) 340px;
gap: 1.5rem;
align-items: start;
margin-bottom: 3rem;
}

.faq-accordion-list {
display: grid;
gap: .95rem;
}

.faq-item-modern {
border-radius: 22px;
background: #ffffff;
border: 1px solid rgba(148, 163, 184, 0.22);
box-shadow: 0 16px 45px rgba(15, 23, 42, 0.06);
overflow: hidden;
}

.faq-item-modern summary {
cursor: pointer;
list-style: none;
padding: 1.2rem 1.35rem;
font-weight: 800;
color: #0f172a;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
}
 .faq-item-modern summary::-webkit-details-marker {
 display: none;
}

.faq-item-modern summary:after {
content: '+';
flex: 0 0 auto;
display: inline-flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
border-radius: 999px;
background: #f1f5f9;
color: #0f172a;
font-size: 1.1rem;
}

.faq-item-modern[open] summary:after {
background: #0f172a;
color: #ffffff;
}

.faq-item-modern p {
margin: 0;
padding: 0 1.35rem 1.35rem;
color: #475569;
line-height: 1.75;
}

.faq-side-card {
position: sticky;
top: 6rem;
padding: 1.4rem;
border-radius: 26px;
background: linear-gradient(180deg, #0f172a, #1e293b);
color: #ffffff;
box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.faq-side-card h2 {
margin: 0 0 .6rem;
color: #ffffff;
}

.faq-side-card p {
margin: 0 0 1.2rem;
color: rgba(255, 255, 255, .78);
line-height: 1.65;
}

.contact-faq-section { padding-bottom: clamp(2rem, 5vw, 4rem); }

.contact-faq-heading { margin-bottom: 1.25rem; }

.contact-faq-heading p {
margin: .45rem 0 0;
color: #64748b;
}

.contact-faq-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 1rem;
}

.contact-faq-card {
padding: 1.2rem;
border-radius: 22px;
background: #ffffff;
border: 1px solid rgba(148, 163, 184, 0.22);
box-shadow: 0 16px 45px rgba(15, 23, 42, 0.06);
}

.contact-faq-card h3 {
margin: 0 0 .55rem;
font-size: 1.02rem;
color: #0f172a;
}

.contact-faq-card p {
margin: 0;
color: #64748b;
line-height: 1.65;
font-size: .95rem;
}

@media (max-width: 980px) {

.faq-page-layout { grid-template-columns: 1fr; }

.faq-side-card {
position: relative;
top: auto;
}

.contact-faq-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {

.content-page-hero.faq-page-hero {
border-radius: 24px;
padding: 1.6rem;
}

.contact-faq-grid { grid-template-columns: 1fr; }
}

/* Patch: compact mobile add-stay button and home listing cards */
.btn-add-stay-plus {
display: none;
font-size: 1.35rem;
line-height: 1;
font-weight: 950;
}

.home-listing-grid { align-items: stretch; }

.home-listing-grid .listing-card-modern {
padding: 1.35rem;
display: flex;
flex-direction: column;
}

.home-listing-grid .card-actions-row { margin-top: auto; }

.home-listing-grid .listing-card-icon { flex: 0 0 auto; }

.profile-listing-card.listing-card-modern.request-version {
padding: 1.15rem;
display: grid;
grid-template-columns: auto minmax(0, 1fr);
gap: 1rem;
align-items: start;
}

.profile-listing-card.listing-card-modern.request-version .listing-card-icon { margin-bottom: 0; }

@media (max-width: 640px) {

.btn-add-stay-mobile {
width: 42px;
height: 42px;
padding: 0;
border-radius: 999px;
font-size: 1.35rem;
flex: 0 0 auto;
}

.btn-add-stay-mobile .btn-add-stay-text { display: none; }

.btn-add-stay-mobile .btn-add-stay-plus {
display: inline-flex;
align-items: center;
justify-content: center;
}
}

/* === Social footer links and video gallery numbers === */
.footer-social-links {
display: flex;
flex-wrap: wrap;
gap: 0.55rem;
margin-top: 1rem;
}

.footer-social-link {
width: 2.25rem;
height: 2.25rem;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
color: #ffffff;
background: linear-gradient(135deg, var(--primary), var(--coral));
box-shadow: 0 12px 26px rgba(20, 35, 80, 0.16);
transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.footer-social-link span {
font-size: 0.78rem;
line-height: 1;
font-weight: 900;
letter-spacing: -0.02em;
text-transform: uppercase;
}
 .footer-social-link:hover, .footer-social-link:focus-visible {
 transform: translateY(-2px);
 box-shadow: 0 16px 34px rgba(20, 35, 80, 0.22);
 opacity: 0.95;
}

.video-slide {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.9rem;
}

.video-step-number {
width: 3.35rem;
height: 3.35rem;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #ffffff;
font-size: 1.35rem;
line-height: 1;
font-weight: 900;
background: linear-gradient(135deg, var(--primary), var(--coral));
border: 4px solid rgba(255, 255, 255, 0.92);
box-shadow: 0 18px 40px rgba(20, 35, 80, 0.18);
position: relative;
z-index: 3;
}

.video-step-number::after {
content: "";
position: absolute;
inset: -8px;
border-radius: inherit;
border: 1px solid rgba(99, 102, 241, 0.18);
pointer-events: none;
}

@media (max-width: 600px) {

.video-slide { gap: 0.8rem; }

.video-step-number {
width: 3rem;
height: 3rem;
font-size: 1.2rem;
flex: 0 0 auto;
}
}

/* === Improved video-gallery numbered cards and footer socials === */
.footer-social-links {
align-items: center;
margin-top: 1.15rem;
padding-top: 0.95rem;
border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-social-link {
min-width: 2.45rem;
width: auto;
height: 2.45rem;
padding: 0 0.72rem;
gap: 0.35rem;
border: 1px solid rgba(255, 255, 255, 0.22);
background: linear-gradient(135deg, #0f766e, #ef4338);
}

.footer-social-link span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 1.05rem;
}

.footer-social-facebook { background: linear-gradient(135deg, #1877f2, #0b4aa2); }

.footer-social-instagram { background: linear-gradient(135deg, #f97316, #c026d3); }

.footer-social-x { background: linear-gradient(135deg, #111827, #334155); }

.footer-social-tiktok { background: linear-gradient(135deg, #111827, #14b8a6); }

.footer-social-youtube { background: linear-gradient(135deg, #ef4444, #991b1b); }

.footer-social-pinterest { background: linear-gradient(135deg, #e60023, #a8071a); }

.footer-social-linkedin { background: linear-gradient(135deg, #0a66c2, #075985); }

.footer-social-viber { background: linear-gradient(135deg, #7360f2, #4c1d95); }

.video-gallery-shell {
width: min(100%, 1240px);
margin: 42px auto 0;
padding: clamp(18px, 2.4vw, 30px);
border-radius: clamp(24px, 3vw, 36px);
background: radial-gradient(circle at 8% 0%, rgba(239, 67, 56, 0.12), transparent 28%), radial-gradient(circle at 94% 10%, rgba(0, 150, 145, 0.16), transparent 30%), linear-gradient(135deg, rgba(255,255,255,0.96), rgba(229,249,255,0.88));
border: 1px solid rgba(8, 37, 73, 0.08);
box-shadow: 0 26px 70px rgba(8, 37, 73, 0.12);
position: relative;
overflow: hidden;
}

.video-gallery-shell::before {
content: "";
position: absolute;
inset: 12px;
border-radius: inherit;
border: 1px dashed rgba(0, 150, 145, 0.22);
pointer-events: none;
}

.video-gallery-heading {
position: relative;
z-index: 1;
text-align: center;
max-width: 760px;
margin: 0 auto 22px;
}

.video-gallery-heading .eyebrow { margin-bottom: 0.35rem; }

.video-gallery-heading h3 {
margin: 0;
color: var(--navy);
font-size: clamp(1.55rem, 2.8vw, 2.25rem);
line-height: 1.08;
letter-spacing: -0.035em;
}

.video-gallery-shell .video-gallery {
max-width: none;
margin: 0;
position: relative;
z-index: 1;
gap: clamp(16px, 2vw, 26px);
}

.video-gallery-shell .video-slide {
display: block;
width: 100%;
}

.video-step-card {
position: relative;
isolation: isolate;
padding-top: 1.7rem;
}

.video-step-badge {
position: absolute;
top: 0px;
left: 50%;
transform: translateX(-50%);
z-index: 5;
min-width: 5.1rem;
height: 3.1rem;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #ffffff;
background: linear-gradient(135deg, var(--navy), #004b88 45%, var(--primary));
border: 5px solid rgba(255,255,255,0.96);
box-shadow: 0 16px 34px rgba(8, 37, 73, 0.28), 0 0 0 1px rgba(8, 37, 73, 0.06);
}

.video-step-badge::before, .video-step-badge::after {
content: "";
position: absolute;
top: 50%;
width: 32px;
height: 4px;
border-radius: 999px;
background: #cc1f15;
transform: translateY(-50%);
}

.video-step-badge::before { left: -22px; }

.video-step-badge::after { right: -22px; }

.video-step-badge span {
font-size: 1.28rem;
line-height: 1;
font-weight: 1000;
letter-spacing: -0.04em;
text-shadow: 0 2px 8px rgba(0,0,0,0.22);
shape-rendering: geometricprecision;
color: #00295e;
}

.video-gallery-shell .video-hover {
border-radius: 26px;
background: #ffffff;
border: 8px solid #ffffff;
box-shadow: 0 24px 56px rgba(8, 37, 73, 0.16);
top: 34px;
}

.video-gallery-shell .video-hover::after {
content: "";
position: absolute;
inset: 0;
z-index: 4;
pointer-events: none;
border-radius: 18px;
box-shadow: inset 0 0 0 1px rgba(8, 37, 73, 0.08);
}

@media (max-width: 900px) {

.video-gallery-shell { width: min(100%, 820px); }
}

@media (max-width: 600px) {

.video-gallery-shell {
margin-top: 28px;
padding: 14px 10px;
border-radius: 24px;
width: 100%;
}

.video-gallery-heading {
margin-bottom: 12px;
padding-inline: 8px;
}

.video-gallery-heading h3 { font-size: 1.35rem; }

.video-gallery-shell .video-gallery {
height: 100svh;
max-width: none;
overflow-y: auto;
display: flex;
flex-direction: column;
gap: 0;
scroll-snap-type: y mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
}

.video-gallery-shell .video-slide {
min-height: 100svh;
width: 100%;
padding: 18px 8px;
display: flex;
align-items: center;
justify-content: center;
scroll-snap-align: center;
scroll-snap-stop: always;
}

.video-step-card { width: min(100%, 430px); }

.video-gallery-shell .video-hover {
width: 100%;
max-height: calc(100svh - 90px);
border-radius: 22px;
border-width: 6px;
}

.video-step-badge {
min-width: 4.55rem;
height: 2.75rem;
}
}

/* === Footer social icons: round visual buttons with inline SVG glyphs === */
.footer-brand-block .footer-social-links {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.72rem;
margin-top: 1.15rem;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.footer-brand-block .footer-social-link {
width: 2.9rem;
height: 2.9rem;
min-width: 2.9rem;
padding: 0;
border: 0;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #ffffff;
text-decoration: none;
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.22);
transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.footer-brand-block .footer-social-link svg {
width: 1.34rem;
height: 1.34rem;
display: block;
fill: currentColor;
}
 .footer-brand-block .footer-social-link:hover, .footer-brand-block .footer-social-link:focus-visible {
 transform: translateY(-3px) scale(1.04);
 box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.28);
 filter: saturate(1.08);
}

.footer-brand-block .footer-social-facebook { background: linear-gradient(145deg, #2f7df6, #1457c5); }

.footer-brand-block .footer-social-instagram { background: radial-gradient(circle at 28% 110%, #feda75 0 18%, #fa7e1e 35%, #d62976 58%, #962fbf 78%, #4f5bd5 100%); }

.footer-brand-block .footer-social-x { background: linear-gradient(145deg, #020617, #111827); }

.footer-brand-block .footer-social-tiktok { background: linear-gradient(145deg, #020617, #111827); }

.footer-brand-block .footer-social-youtube { background: linear-gradient(145deg, #ff2b2b, #b91c1c); }

.footer-brand-block .footer-social-pinterest { background: linear-gradient(145deg, #e60023, #bd081c); }

.footer-brand-block .footer-social-linkedin { background: linear-gradient(145deg, #1976d2, #0a66c2); }

.footer-brand-block .footer-social-viber { background: linear-gradient(145deg, #7360f2, #4f3bbd); }

@media (max-width: 560px) {

.footer-brand-block .footer-social-links { gap: 0.55rem; }

.footer-brand-block .footer-social-link {
width: 2.55rem;
height: 2.55rem;
min-width: 2.55rem;
}

.footer-brand-block .footer-social-link svg {
width: 1.16rem;
height: 1.16rem;
}
}

/* === Footer mobile refresh and compact social buttons === */
.footer-brand-block .footer-social-links { gap: 0.5rem; }

.footer-brand-block .footer-social-link {
width: 2rem;
height: 2rem;
min-width: 2rem;
margin: 0;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.footer-brand-block .footer-social-link svg {
width: 0.98rem;
height: 0.98rem;
}
 .footer-brand-block .footer-social-link:hover, .footer-brand-block .footer-social-link:focus-visible {
 transform: translateY(-2px) scale(1.05);
 box-shadow: 0 12px 24px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

@media (max-width: 720px) {

.site-footer {
margin-top: 3rem;
padding: 2.25rem 0 1.35rem;
background: radial-gradient(circle at 15% 0%, rgba(22, 184, 166, 0.24), transparent 15rem), radial-gradient(circle at 95% 5%, rgba(255, 122, 89, 0.22), transparent 14rem), linear-gradient(180deg, #061a2e 0%, #0E2A47 100%);
}

.site-footer .footer-grid {
grid-template-columns: 1fr;
gap: 1.05rem;
}

.footer-brand-block {
text-align: center;
padding: 1.35rem 1.15rem 1.15rem;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 1.55rem;
background: rgba(255, 255, 255, 0.055);
box-shadow: 0 18px 48px rgba(0, 0, 0, 0.14);
}

.footer-brand-block .brand-footer { justify-content: center; }

.footer-brand-block p {
margin: 0.85rem auto 0;
max-width: 22rem;
}

.footer-brand-block .footer-social-links {
justify-content: center;
width: fit-content;
max-width: 100%;
margin: 1.1rem auto 0;
padding: 0.7rem 0.8rem;
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.site-footer .footer-menu-block {
padding: 1rem;
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 1.25rem;
background: rgba(255, 255, 255, 0.055);
box-shadow: 0 14px 38px rgba(0, 0, 0, 0.1);
}

.site-footer .footer-menu-block h3 {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.75rem;
font-size: 0.76rem;
letter-spacing: 0.14em;
color: rgba(255, 255, 255, 0.74);
}

.site-footer .footer-menu-block h3::before {
content: "";
width: 0.55rem;
height: 0.55rem;
border-radius: 999px;
background: linear-gradient(135deg, var(--teal), var(--coral));
box-shadow: 0 0 0 0.35rem rgba(22, 184, 166, 0.12);
}

.site-footer .footer-menu-block a {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.7rem;
margin: 0.48rem 0;
padding: 0.74rem 0.88rem;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 0.92rem;
background: rgba(255, 255, 255, 0.075);
color: rgba(255, 255, 255, 0.88);
font-size: 0.95rem;
line-height: 1.2;
}

.site-footer .footer-menu-block a::after {
flex: 0 0 auto;
width: 1.45rem;
height: 1.45rem;
display: inline-grid;
place-items: center;
border-radius: 999px;
color: #ffffff;
background: rgba(22, 184, 166, 0.22);
border: 1px solid rgba(22, 184, 166, 0.28);
font-size: 1.15rem;
line-height: 1;
}
 .site-footer .footer-menu-block a:hover, .site-footer .footer-menu-block a:focus-visible {
 background: rgba(255, 255, 255, 0.13);
 border-color: rgba(255, 255, 255, 0.18);
 color: #ffffff;
 transform: translateY(-1px);
}

.footer-bottom {
margin-top: 1.2rem;
padding-top: 1rem;
display: grid;
gap: 0.35rem;
text-align: center;
font-size: 0.84rem;
}
}

@media (max-width: 420px) {

.footer-brand-block .footer-social-links {
gap: 0.42rem;
padding-inline: 0.65rem;
}

.footer-brand-block .footer-social-link {
width: 2rem;
height: 2rem;
min-width: 2rem;
}

.footer-brand-block .footer-social-link svg {
width: 0.94rem;
height: 0.94rem;
}
}

/* === Mobile footer ordering and centered copyright === */
@media (max-width: 720px) {

.site-footer .footer-grid { display: grid; }

.site-footer .footer-menu-company { order: 1; }

.site-footer .footer-menu-services { order: 2; }

.site-footer .footer-menu-legal { order: 3; }

.site-footer .footer-brand-block { order: 10; }

.site-footer .footer-bottom {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 0.35rem;
width: 100%;
}

.site-footer .footer-bottom span {
display: block;
width: 100%;
text-align: center;
}
}

/* Host/profile listing upgrades */
.listing-card-modern {
isolation: isolate;
padding: 1.35rem;
border-color: rgba(99, 102, 241, .16);
background: linear-gradient(160deg, rgba(255,255,255,.98), rgba(248,250,252,.94));
}

.listing-card-modern::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background: radial-gradient(circle at 85% 10%, rgba(14,165,233,.13), transparent 32%), radial-gradient(circle at 0 100%, rgba(20,184,166,.12), transparent 28%);
opacity: .8;
}

.listing-card-modern.is-featured {
border-color: rgba(245, 158, 11, .38);
background: linear-gradient(160deg, rgba(255,251,235,.98), rgba(255,255,255,.94));
box-shadow: 0 24px 70px rgba(245, 158, 11, .13), 0 18px 45px rgba(15, 23, 42, .08);
}

.listing-card-modern.is-featured::before { background: radial-gradient(circle at 88% 4%, rgba(245,158,11,.25), transparent 34%), radial-gradient(circle at 0 100%, rgba(20,184,166,.10), transparent 30%); }

.listing-featured-ribbon {
position: absolute;
top: 16px;
right: -42px;
z-index: 4;
min-width: 150px;
transform: rotate(35deg);
text-align: center;
padding: .38rem .7rem;
font-size: .72rem;
font-weight: 900;
letter-spacing: .02em;
color: #7c2d12;
background: linear-gradient(135deg, #fef3c7, #facc15);
box-shadow: 0 10px 22px rgba(245, 158, 11, .24);
}

.card-user {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: .45rem;
}

.user-mini-icon, .profile-icon-preview {
width: 28px;
height: 28px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
font-weight: 900;
background: linear-gradient(135deg, rgba(15,23,42,.08), rgba(20,184,166,.12));
color: #0f172a;
box-shadow: inset 0 0 0 1px rgba(15,23,42,.08);
}

.profile-icon-host, .badge-host {
background: rgba(14, 165, 233, .13);
color: #0369a1;
}

.profile-icon-pro_traveller, .badge-professional {
background: rgba(124, 58, 237, .12);
color: #5b21b6;
}

.listing-view-compact {
padding: 1rem;
border-radius: 22px;
}

.listing-view-compact .listing-card-media {
height: 135px;
margin: -1rem -1rem .9rem;
}

.listing-view-gallery .listing-card-media { height: 225px; }

.listing-view-highlight {
border-width: 2px;
box-shadow: 0 30px 75px rgba(15, 23, 42, .12);
}

.listing-view-highlight:not(.is-featured) { background: linear-gradient(160deg, rgba(240,253,250,.98), rgba(255,255,255,.94)); }

.profile-icon-choices {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: .75rem;
}

/* Owner/user listing card layout refresh */
.owner-listing-grid {
grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
align-items: stretch;
}

.owner-management-card {
display: grid;
grid-template-rows: auto 1fr auto;
min-height: 100%;
padding: 0;
border-radius: 30px;
overflow: hidden;
background: linear-gradient(160deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
}

.owner-management-card.is-featured { background: linear-gradient(160deg, rgba(255,251,235,.98), rgba(255,255,255,.95)); }

.owner-card-media-wrap, .owner-request-visual {
position: relative;
min-height: 196px;
background: linear-gradient(135deg, rgba(20,184,166,.15), rgba(59,130,246,.14));
}

.owner-card-media-wrap .listing-card-media, .owner-card-media {
height: 196px;
margin: 0;
border-radius: 0;
}

.owner-request-visual {
display: flex;
align-items: center;
justify-content: center;
min-height: 170px;
}

.owner-request-icon {
width: 78px;
height: 78px;
border-radius: 26px;
margin: 0;
background: rgba(255,255,255,.74);
backdrop-filter: blur(14px);
box-shadow: 0 18px 38px rgba(15,23,42,.12), inset 0 0 0 1px rgba(15,23,42,.06);
}

.owner-card-overlay-badges {
position: absolute;
left: 16px;
right: 16px;
bottom: 14px;
z-index: 5;
display: flex;
justify-content: space-between;
align-items: center;
gap: .55rem;
flex-wrap: wrap;
}

.owner-card-overlay-badges-static {
top: 16px;
bottom: auto;
}

.owner-card-overlay-badges .badge, .profile-user-card-top .badge, .profile-user-card-top .detail-pill {
box-shadow: 0 10px 26px rgba(15,23,42,.10);
backdrop-filter: blur(12px);
}

.owner-card-content {
display: flex;
flex-direction: column;
gap: 1rem;
padding: 1.25rem 1.3rem 1rem;
}

.owner-card-title-row {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: .9rem;
align-items: start;
}

.owner-card-kicker {
display: inline-flex;
margin-bottom: .36rem;
color: var(--muted, #64748b);
font-size: .72rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .085em;
}

.owner-card-title-row h3 {
margin: 0;
font-size: 1.22rem;
line-height: 1.18;
letter-spacing: -.035em;
}

.owner-card-type-icon {
width: 42px;
height: 42px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 16px;
color: var(--primary, #0f766e);
background: rgba(20,184,166,.12);
box-shadow: inset 0 0 0 1px rgba(20,184,166,.18);
}

.owner-card-description {
min-height: 0 !important;
margin: 0;
color: var(--muted, #64748b);
font-weight: 700;
line-height: 1.55;
}

.owner-card-info-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: .72rem;
margin-top: .1rem;
}

.owner-info-item {
min-width: 0;
padding: .82rem .9rem;
border-radius: 18px;
background: rgba(15,23,42,.035);
border: 1px solid rgba(148,163,184,.16);
}

.owner-info-item small {
display: block;
margin-bottom: .28rem;
color: var(--muted, #64748b);
font-size: .72rem;
font-weight: 900;
text-transform: uppercase;
letter-spacing: .045em;
}

.owner-info-item strong {
display: block;
overflow: hidden;
color: var(--navy, #0f172a);
font-size: .94rem;
font-weight: 950;
line-height: 1.2;
text-overflow: ellipsis;
white-space: nowrap;
}

.owner-info-price {
background: rgba(20,184,166,.09);
border-color: rgba(20,184,166,.18);
}

.owner-card-footer {
display: flex !important;
align-items: center;
gap: .55rem;
flex-wrap: wrap;
margin-top: 0 !important;
padding: 1rem 1.3rem 1.25rem;
border-top: 1px solid rgba(148,163,184,.16);
background: rgba(248,250,252,.78);
}

.owner-card-footer .btn { min-height: 38px; }

.owner-card-footer .inline-form { display: inline-flex; }

.profile-user-listing-card {
display: grid;
grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
gap: 0;
padding: 0 !important;
border-radius: 26px;
overflow: hidden;
background: linear-gradient(160deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
}

.profile-user-listing-card.is-featured { background: linear-gradient(160deg, rgba(255,251,235,.98), rgba(255,255,255,.95)); }

.profile-user-listing-card::before { display: none; }

.profile-user-card-media {
height: 100% !important;
min-height: 190px;
margin: 0 !important;
border-radius: 0 !important;
}

.profile-user-card-body {
display: flex;
flex-direction: column;
gap: .65rem;
padding: 1rem 1.1rem;
}

.profile-user-card-top {
display: flex;
align-items: center;
justify-content: space-between;
gap: .45rem;
flex-wrap: wrap;
}

.profile-user-card-body h3 { margin: 0; }

.profile-user-card-body p { margin: 0; }

.profile-user-card-meta { padding-top: .2rem; }

.profile-card-link {
display: inline-flex;
align-items: center;
justify-content: center;
align-self: flex-start;
margin-top: auto;
padding: .55rem .85rem;
border-radius: 999px;
color: var(--primary, #0f766e);
background: rgba(20,184,166,.10);
font-size: .85rem;
font-weight: 950;
text-decoration: none;
}

.profile-card-link:hover {
color: #fff;
background: var(--primary, #0f766e);
}

.profile-user-request-card { grid-template-columns: 82px minmax(0, 1fr); }

.profile-user-request-icon {
width: 54px;
height: 54px;
margin: 1rem 0 0 1rem !important;
align-self: start;
}

@media (max-width: 760px) {

.owner-listing-grid { grid-template-columns: 1fr; }

.owner-card-info-grid { grid-template-columns: 1fr; }

.profile-user-listing-card, .profile-user-request-card { grid-template-columns: 1fr; }

.profile-user-card-media { min-height: 170px; }

.profile-user-request-icon { margin: 1rem 0 0 1rem !important; }

.owner-card-footer .btn, .owner-card-footer .inline-form, .owner-card-footer .inline-form .btn { width: 100%; }
}

/* Unified listing cards - shared by home, explore, stays, owner pages and profiles */
.unified-listing-card {
position: relative;
display: grid;
grid-template-rows: auto 1fr auto;
min-width: 0;
overflow: hidden;
border: 1px solid rgba(20, 35, 52, .08);
border-radius: 24px;
background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,251,253,.96));
box-shadow: 0 18px 50px rgba(14, 26, 44, .08);
transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

.unified-listing-card:hover {
transform: translateY(-4px);
border-color: rgba(43, 182, 177, .22);
box-shadow: 0 24px 70px rgba(14, 26, 44, .13);
}

.unified-listing-card.is-featured {
background: linear-gradient(145deg, rgba(255, 248, 230, .98), rgba(255,255,255,.97) 48%, rgba(235, 252, 250, .92));
border-color: rgba(255, 185, 80, .42);
}

.unified-listing-card::before {
content: '';
position: absolute;
inset: 0;
pointer-events: none;
background: radial-gradient(circle at 18% 0%, rgba(43, 182, 177, .10), transparent 34%);
opacity: .75;
}

.unified-listing-card.is-featured::before { background: radial-gradient(circle at 15% 0%, rgba(255, 186, 73, .18), transparent 35%), radial-gradient(circle at 100% 0%, rgba(43, 182, 177, .12), transparent 32%); }

.ll-card-visual-wrap, .ll-card-main, .ll-card-footer {
position: relative;
z-index: 1;
}

.ll-card-visual-wrap { padding: 12px 12px 0; }

.ll-card-media, .ll-card-icon-visual {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 188px;
overflow: hidden;
border-radius: 18px;
background: linear-gradient(135deg, rgba(8, 33, 55, .08), rgba(43, 182, 177, .14));
text-decoration: none;
}

.ll-card-media img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .32s ease;
}

.unified-listing-card:hover .ll-card-media img { transform: scale(1.045); }

.ll-card-icon-visual .listing-card-icon {
display: grid;
place-items: center;
width: 74px;
height: 74px;
border-radius: 24px;
margin: 0;
background: rgba(255,255,255,.86);
color: var(--teal, #19a7a0);
box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), 0 14px 34px rgba(8, 33, 55, .12);
}

.ll-card-kind-request .ll-card-icon-visual { background: linear-gradient(135deg, rgba(255, 122, 89, .14), rgba(8, 33, 55, .08)); }

.ll-card-kind-stay .ll-card-icon-visual { background: linear-gradient(135deg, rgba(43, 182, 177, .14), rgba(29, 99, 138, .10)); }

.ll-card-floating-badges {
position: absolute;
top: 22px;
right: 22px;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 6px;
max-width: calc(100% - 44px);
}

.ll-card-floating-badges .badge, .unified-listing-card .listing-featured-ribbon { box-shadow: 0 10px 24px rgba(14, 26, 44, .12); }

.ll-card-main {
display: flex;
flex-direction: column;
gap: 12px;
padding: 18px 18px 16px;
}

.ll-card-topline {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
min-height: 26px;
}

.ll-card-title {
margin: 0;
font-size: clamp(1.05rem, 1vw + .84rem, 1.25rem);
line-height: 1.24;
letter-spacing: -.02em;
}

.ll-card-title a {
color: var(--navy, #10253f);
text-decoration: none;
}

.ll-card-title a:hover { color: var(--teal, #19a7a0); }

.ll-card-subtitle, .ll-card-description {
margin: 0;
color: rgba(16, 37, 63, .70);
line-height: 1.55;
}

.ll-card-description { min-height: 3.2em; }

.ll-card-info-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 9px;
margin-top: 2px;
}

.ll-card-info-item {
min-width: 0;
padding: 10px 11px;
border: 1px solid rgba(16, 37, 63, .07);
border-radius: 15px;
background: rgba(255,255,255,.72);
}

.ll-card-info-item small {
display: block;
margin-bottom: 4px;
color: rgba(16, 37, 63, .48);
font-size: .72rem;
font-weight: 800;
letter-spacing: .05em;
text-transform: uppercase;
}

.ll-card-info-item strong {
display: block;
overflow: hidden;
color: rgba(16, 37, 63, .92);
font-size: .93rem;
line-height: 1.25;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-info-item.ll-card-price strong { color: var(--teal, #19a7a0); }

.ll-card-user {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px;
margin-top: auto;
padding-top: 4px;
}

.ll-card-user .user-name {
font-weight: 800;
color: rgba(16, 37, 63, .82);
}

.ll-card-footer {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px;
padding: 0 18px 18px;
margin-top: auto;
}

.ll-card-footer .btn, .ll-card-footer .inline-form, .ll-card-footer .inline-form .btn { margin: 0; }

.ll-card-footer .inline-form { display: inline-flex; }

.ll-card-variant-owner {
grid-template-columns: 210px minmax(0, 1fr);
grid-template-rows: auto auto;
align-items: stretch;
}

.ll-card-variant-owner .ll-card-visual-wrap {
grid-row: 1 / span 2;
padding: 14px 0 14px 14px;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual {
height: 100%;
min-height: 205px;
}

.ll-card-variant-owner .ll-card-main { padding: 18px 18px 10px; }

.ll-card-variant-owner .ll-card-footer { padding: 0 18px 18px; }

.ll-card-variant-profile .ll-card-media, .ll-card-variant-profile .ll-card-icon-visual { height: 150px; }

.ll-card-variant-profile .ll-card-description { min-height: 0; }

.profile-listing-card.unified-listing-card { padding: 0; }

.profile-listing-grid .unified-listing-card { min-height: 100%; }

.listing-view-compact.unified-listing-card .ll-card-visual-wrap { display: none; }

.listing-view-gallery.unified-listing-card .ll-card-media, .listing-view-gallery.unified-listing-card .ll-card-icon-visual { height: 230px; }

.listing-view-highlight.unified-listing-card {
border-width: 2px;
box-shadow: 0 22px 70px rgba(43, 182, 177, .15);
}

@media (max-width: 900px) {

.ll-card-variant-owner {
grid-template-columns: 1fr;
grid-template-rows: auto 1fr auto;
}

.ll-card-variant-owner .ll-card-visual-wrap {
grid-row: auto;
padding: 12px 12px 0;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual {
height: 180px;
min-height: 0;
}
}

@media (max-width: 560px) {

.ll-card-info-grid { grid-template-columns: 1fr; }

.ll-card-main { padding: 16px; }

.ll-card-footer { padding: 0 16px 16px; }

.ll-card-footer .btn, .ll-card-footer .inline-form, .ll-card-footer .inline-form .btn { width: 100%; }
}

/* Compact listing card template v2 - shared cards */
.modern-listing-grid, .results-grid.modern-listing-grid, .owner-listing-grid, .profile-listing-grid { gap: 1rem; }

.modern-listing-grid, .results-grid.modern-listing-grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }

.owner-listing-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }

.unified-listing-card {
display: grid;
grid-template-rows: auto 1fr auto;
min-width: 0;
overflow: hidden;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 22px;
background: #fff;
box-shadow: 0 10px 32px rgba(15, 23, 42, .07);
transform: translateZ(0);
}

.unified-listing-card::before { display: none; }

.unified-listing-card:hover {
transform: translateY(-2px);
border-color: rgba(20, 184, 166, .25);
box-shadow: 0 18px 44px rgba(15, 23, 42, .11);
}

.unified-listing-card.is-featured {
background: linear-gradient(180deg, #fff8e8 0%, #ffffff 58%);
border-color: rgba(245, 158, 11, .34);
box-shadow: 0 14px 40px rgba(245, 158, 11, .10), 0 10px 28px rgba(15, 23, 42, .07);
}

.ll-card-visual-wrap {
position: relative;
z-index: 1;
width: 100%;
padding: 0;
overflow: hidden;
background: #eef4f7;
}

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 154px;
margin: 0 !important;
overflow: hidden;
border-radius: 0;
background: linear-gradient(135deg, rgba(20,184,166,.12), rgba(59,130,246,.10));
text-decoration: none;
}

.unified-listing-card .ll-card-media img, .unified-listing-card .listing-card-media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.unified-listing-card:hover .ll-card-media img { transform: scale(1.025); }

.ll-card-kind-request .ll-card-icon-visual, .ll-card-kind-stay .ll-card-icon-visual { height: 122px; }

.ll-card-icon-visual .listing-card-icon {
width: 56px;
height: 56px;
border-radius: 18px;
margin: 0;
background: rgba(255,255,255,.86);
box-shadow: 0 12px 26px rgba(15, 23, 42, .10), inset 0 0 0 1px rgba(255,255,255,.7);
}

.ll-card-icon-visual .listing-card-icon svg {
width: 26px;
height: 26px;
}

.ll-card-main {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
gap: .55rem;
padding: .95rem 1rem .9rem;
}

.ll-card-topline {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: .65rem;
min-height: 0;
}

.ll-card-topline > .badge {
max-width: 62%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-primary-pill {
display: inline-flex;
flex-direction: column;
align-items: flex-end;
gap: .05rem;
margin-left: auto;
padding: .32rem .52rem;
border-radius: 12px;
background: rgba(20, 184, 166, .10);
color: var(--teal, #19a7a0);
text-align: right;
}

.ll-card-primary-pill small {
color: rgba(15, 23, 42, .48);
font-size: .61rem;
font-weight: 850;
line-height: 1;
text-transform: uppercase;
letter-spacing: .045em;
}

.ll-card-primary-pill strong {
overflow: visible;
font-size: .86rem;
font-weight: 950;
line-height: 1.12;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-title {
margin: 0;
font-size: 1.02rem;
line-height: 1.24;
letter-spacing: -.015em;
}

.ll-card-title a {
color: var(--navy, #10253f);
text-decoration: none;
}

.ll-card-title a:hover { color: var(--teal, #19a7a0); }

.ll-card-subtitle, .ll-card-description {
margin: 0;
color: rgba(15, 23, 42, .62);
font-size: .9rem;
line-height: 1.45;
}

.ll-card-description {
display: -webkit-box;
min-height: 0;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.ll-card-meta-row {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: .42rem;
margin-top: .05rem;
}

.ll-card-meta-chip {
display: inline-flex;
align-items: center;
min-width: 0;
max-width: 100%;
gap: .35rem;
padding: .38rem .52rem;
border: 1px solid rgba(15, 23, 42, .07);
border-radius: 999px;
background: rgba(248, 250, 252, .92);
color: rgba(15, 23, 42, .74);
font-size: .78rem;
line-height: 1;
}

.ll-card-meta-chip small {
color: rgba(15, 23, 42, .44);
font-size: .62rem;
font-weight: 850;
text-transform: uppercase;
letter-spacing: .045em;
}

.ll-card-meta-chip strong {
min-width: 0;
overflow: hidden;
font-size: .78rem;
font-weight: 850;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-chip-category {
background: rgba(20, 184, 166, .09);
border-color: rgba(20, 184, 166, .14);
color: #0f766e;
}

.ll-card-chip-location {
background: rgba(59, 130, 246, .08);
border-color: rgba(59, 130, 246, .12);
color: #1d4ed8;
}

.ll-card-chip-date, .ll-card-chip-rating {
background: rgba(245, 158, 11, .09);
border-color: rgba(245, 158, 11, .14);
color: #b45309;
}

.ll-card-user {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: .4rem;
margin-top: auto;
padding-top: .18rem;
color: rgba(15, 23, 42, .72);
font-size: .86rem;
}

.ll-card-user .user-name { font-weight: 850; }

.unified-listing-card .user-mini-icon {
width: 24px;
height: 24px;
font-size: .78rem;
}

.ll-card-footer {
position: relative;
z-index: 1;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: .45rem;
padding: 0 1rem 1rem;
margin-top: 0;
}

.ll-card-footer .btn {
min-height: 34px;
padding: .48rem .72rem;
border-radius: 12px;
font-size: .82rem;
}

.ll-card-floating-badges {
top: .7rem;
right: .7rem;
left: .7rem;
max-width: none;
justify-content: flex-end;
pointer-events: none;
}

.unified-listing-card .listing-featured-ribbon {
top: 12px;
right: -44px;
z-index: 5;
padding: .28rem .55rem;
font-size: .66rem;
}

/* Owner pages use the same card, but horizontal and compact. */
.ll-card-variant-owner {
grid-template-columns: 154px minmax(0, 1fr);
grid-template-rows: 1fr auto;
}

.ll-card-variant-owner .ll-card-visual-wrap {
grid-row: 1 / span 2;
height: 100%;
min-height: 172px;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual, .ll-card-variant-owner .listing-card-media {
height: 100%;
min-height: 172px;
}

.ll-card-variant-owner .ll-card-main { padding: .95rem 1rem .7rem; }

.ll-card-variant-owner .ll-card-footer { padding: 0 1rem .95rem; }

/* Profile cards stay even tighter. */
.ll-card-variant-profile .ll-card-media, .ll-card-variant-profile .ll-card-icon-visual, .ll-card-variant-profile .listing-card-media { height: 128px; }

.ll-card-variant-profile .ll-card-main { padding: .85rem .9rem .8rem; }

.profile-user-listing-card { grid-template-columns: 138px minmax(0, 1fr); }

.profile-user-request-card { grid-template-columns: 92px minmax(0, 1fr); }

.profile-user-request-card .ll-card-icon-visual { min-height: 100%; }

.listing-view-gallery.unified-listing-card .ll-card-media, .listing-view-gallery.unified-listing-card .ll-card-icon-visual { height: 188px; }

.listing-view-compact.unified-listing-card .ll-card-visual-wrap { display: block; }

.listing-view-compact.unified-listing-card .ll-card-media, .listing-view-compact.unified-listing-card .ll-card-icon-visual { height: 108px; }

@media (max-width: 900px) {

.ll-card-variant-owner, .profile-user-listing-card, .profile-user-request-card {
grid-template-columns: 1fr;
grid-template-rows: auto 1fr auto;
}

.ll-card-variant-owner .ll-card-visual-wrap {
grid-row: auto;
min-height: 0;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual, .ll-card-variant-owner .listing-card-media {
height: 148px;
min-height: 0;
}
}

@media (max-width: 560px) {

.modern-listing-grid, .results-grid.modern-listing-grid, .owner-listing-grid, .profile-listing-grid { grid-template-columns: 1fr; }

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media { height: 142px; }

.ll-card-topline { align-items: stretch; }

.ll-card-primary-pill { width: auto; }

.ll-card-meta-chip { max-width: 100%; }

.ll-card-footer .btn, .ll-card-footer .inline-form, .ll-card-footer .inline-form .btn { width: auto; }
}

/* Table listing card template v3 - cleaner fields and separate user block */
.modern-listing-grid, .results-grid.modern-listing-grid, .owner-listing-grid, .profile-listing-grid { gap: 1rem; }

.modern-listing-grid, .results-grid.modern-listing-grid { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }

.owner-listing-grid { grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); }

.unified-listing-card {
display: grid;
grid-template-rows: auto 1fr auto;
min-width: 0;
overflow: hidden;
border: 1px solid rgba(15, 23, 42, .09);
border-radius: 22px;
background: #ffffff;
box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
}

.unified-listing-card:hover {
transform: translateY(-2px);
border-color: rgba(20, 184, 166, .24);
box-shadow: 0 16px 36px rgba(15, 23, 42, .10);
}

.unified-listing-card.is-featured {
background: linear-gradient(180deg, #fff8e7 0%, #ffffff 48%, #f7fffd 100%);
border-color: rgba(245, 158, 11, .36);
}

.unified-listing-card::before { display: none !important; }

.ll-card-visual-wrap {
position: relative;
z-index: 1;
width: 100%;
padding: 0 !important;
overflow: hidden;
background: #edf3f6;
}

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 148px;
min-height: 0;
margin: 0 !important;
overflow: hidden;
border-radius: 0 !important;
background: linear-gradient(135deg, rgba(20, 184, 166, .12), rgba(59, 130, 246, .10));
text-decoration: none;
}

.unified-listing-card .ll-card-media img, .unified-listing-card .listing-card-media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.unified-listing-card:hover .ll-card-media img { transform: scale(1.02); }

.ll-card-kind-request .ll-card-icon-visual, .ll-card-kind-stay .ll-card-icon-visual { height: 118px; }

.ll-card-icon-visual .listing-card-icon {
width: 52px;
height: 52px;
border-radius: 16px;
margin: 0;
background: rgba(255, 255, 255, .9);
box-shadow: 0 12px 24px rgba(15, 23, 42, .10), inset 0 0 0 1px rgba(255,255,255,.7);
}

.ll-card-icon-visual .listing-card-icon svg {
width: 24px;
height: 24px;
}

.ll-card-main {
position: relative;
z-index: 1;
display: grid;
grid-template-rows: auto auto auto 1fr auto;
gap: .6rem;
padding: .9rem .95rem .95rem;
}

.ll-card-topline {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: start;
gap: .65rem;
min-height: 0;
}

.ll-card-topline > .badge {
justify-self: start;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-primary-pill {
display: inline-grid;
justify-items: end;
gap: .05rem;
padding: .34rem .56rem;
border: 1px solid rgba(20, 184, 166, .16);
border-radius: 12px;
background: rgba(20, 184, 166, .09);
color: var(--teal, #19a7a0);
text-align: right;
}

.ll-card-primary-pill small {
color: rgba(15, 23, 42, .48);
font-size: .6rem;
font-weight: 850;
line-height: 1;
text-transform: uppercase;
letter-spacing: .045em;
}

.ll-card-primary-pill strong {
overflow: visible;
font-size: .86rem;
font-weight: 950;
line-height: 1.1;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-title {
margin: 0;
font-size: 1rem;
line-height: 1.25;
letter-spacing: -.012em;
}

.ll-card-title a {
color: var(--navy, #10253f);
text-decoration: none;
}

.ll-card-title a:hover { color: var(--teal, #19a7a0); }

.ll-card-subtitle, .ll-card-description {
margin: 0;
color: rgba(15, 23, 42, .62);
font-size: .88rem;
line-height: 1.42;
}

.ll-card-description {
display: -webkit-box;
min-height: 0;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}

.ll-card-table {
display: grid;
overflow: hidden;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 14px;
background: #ffffff;
}

.ll-card-table-row {
display: grid;
grid-template-columns: 92px minmax(0, 1fr);
align-items: center;
min-height: 34px;
border-bottom: 1px solid rgba(15, 23, 42, .065);
}

.ll-card-table-row:last-child { border-bottom: 0; }

.ll-card-table-label, .ll-card-table-value {
min-width: 0;
padding: .48rem .62rem;
font-size: .78rem;
line-height: 1.15;
}

.ll-card-table-label {
height: 100%;
display: flex;
align-items: center;
border-right: 1px solid rgba(15, 23, 42, .065);
background: rgba(248, 250, 252, .95);
color: rgba(15, 23, 42, .48);
font-weight: 850;
text-transform: uppercase;
letter-spacing: .035em;
}

.ll-card-table-value {
overflow: hidden;
color: rgba(15, 23, 42, .82);
font-weight: 850;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-row-category .ll-card-table-value { color: #0f766e; }

.ll-row-location .ll-card-table-value { color: #1d4ed8; }

.ll-row-date .ll-card-table-value, .ll-row-rating .ll-card-table-value { color: #b45309; }

.ll-card-user-panel {
display: grid;
gap: .44rem;
margin-top: .05rem;
padding: .62rem .7rem;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 14px;
background: linear-gradient(180deg, rgba(248, 250, 252, .95), rgba(255,255,255,.96));
}

.ll-card-user-label {
color: rgba(15, 23, 42, .46);
font-size: .64rem;
font-weight: 850;
line-height: 1;
text-transform: uppercase;
letter-spacing: .055em;
}

.ll-card-user-row {
display: flex;
align-items: center;
min-width: 0;
gap: .48rem;
}

.ll-card-user-row .user-name {
min-width: 0;
overflow: hidden;
color: rgba(15, 23, 42, .84);
font-size: .88rem;
font-weight: 900;
text-overflow: ellipsis;
white-space: nowrap;
}

.ll-card-user-badges {
display: flex;
flex-wrap: wrap;
gap: .35rem;
}

.unified-listing-card .user-mini-icon {
flex: 0 0 auto;
width: 30px;
height: 30px;
font-size: 1.4rem;
}

.ll-card-footer {
position: relative;
z-index: 1;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: .45rem;
padding: 0 .95rem .95rem;
margin-top: 0;
}

.ll-card-footer .btn {
min-height: 34px;
padding: .48rem .72rem;
border-radius: 11px;
font-size: .82rem;
}

.ll-card-floating-badges {
top: .65rem;
right: .65rem;
left: .65rem;
max-width: none;
justify-content: flex-end;
pointer-events: none;
}

.unified-listing-card .listing-featured-ribbon {
top: 10px;
right: -44px;
z-index: 5;
padding: .26rem .55rem;
font-size: .64rem;
}

.ll-card-meta-row, .ll-card-info-grid, .ll-card-user.card-user { display: none !important; }

.ll-card-variant-owner {
grid-template-columns: 150px minmax(0, 1fr);
grid-template-rows: 1fr auto;
}

.ll-card-variant-owner .ll-card-visual-wrap {
grid-row: 1 / span 2;
height: 100%;
min-height: 178px;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual, .ll-card-variant-owner .listing-card-media {
height: 100%;
min-height: 178px;
}

.ll-card-variant-owner .ll-card-main {
grid-template-rows: auto auto auto auto;
padding: .85rem .95rem .72rem;
}

.ll-card-variant-owner .ll-card-description { -webkit-line-clamp: 1; }

.ll-card-variant-owner .ll-card-table-row {
grid-template-columns: 86px minmax(0, 1fr);
min-height: 32px;
}

.ll-card-variant-owner .ll-card-user-panel { margin-top: 0; }

.ll-card-variant-owner .ll-card-footer { padding: 0 .95rem .9rem; }

.ll-card-variant-profile .ll-card-media, .ll-card-variant-profile .ll-card-icon-visual, .ll-card-variant-profile .listing-card-media { height: 128px; }

.ll-card-variant-profile .ll-card-main { padding: .82rem .9rem .86rem; }

.profile-user-listing-card { grid-template-columns: 136px minmax(0, 1fr); }

.profile-user-request-card { grid-template-columns: 92px minmax(0, 1fr); }

.profile-user-request-card .ll-card-icon-visual { min-height: 100%; }

.listing-view-gallery.unified-listing-card .ll-card-media, .listing-view-gallery.unified-listing-card .ll-card-icon-visual { height: 178px; }

.listing-view-compact.unified-listing-card .ll-card-visual-wrap { display: block; }

.listing-view-compact.unified-listing-card .ll-card-media, .listing-view-compact.unified-listing-card .ll-card-icon-visual { height: 104px; }

@media (max-width: 900px) {

.owner-listing-grid { grid-template-columns: 1fr; }

.ll-card-variant-owner, .profile-user-listing-card, .profile-user-request-card {
grid-template-columns: 1fr;
grid-template-rows: auto 1fr auto;
}

.ll-card-variant-owner .ll-card-visual-wrap {
grid-row: auto;
min-height: 0;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual, .ll-card-variant-owner .listing-card-media {
height: 142px;
min-height: 0;
}
}

@media (max-width: 560px) {

.modern-listing-grid, .results-grid.modern-listing-grid, .owner-listing-grid, .profile-listing-grid { grid-template-columns: 1fr; }

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media { height: 138px; }

.ll-card-topline {/* grid-template-columns: 1fr; */ }

.ll-card-primary-pill {
justify-items: start;
width: 100%;
text-align: left;
}

.ll-card-table-row { grid-template-columns: 82px minmax(0, 1fr); }

.ll-card-table-label, .ll-card-table-value {
padding: .46rem .54rem;
font-size: .74rem;
}

.ll-card-footer .btn, .ll-card-footer .inline-form, .ll-card-footer .inline-form .btn { width: 100%; }
}

/* Card refinement v4 - featured as card state, table fields panel, user rating */
.unified-listing-card.is-featured {
background: linear-gradient(180deg, #fff7df 0%, #ffffff 42%, #f3fffc 100%);
border-color: rgb(255 160 0 / 67%);
box-shadow: 0 14px 36px rgba(245, 158, 11, .12), 0 10px 28px rgba(15, 23, 42, .06);
}

.unified-listing-card .ll-card-visual-wrap {
padding: .72rem .72rem 0 !important;
overflow: visible;
background: transparent;
}

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media {
border-radius: 16px !important;
overflow: hidden;
background: linear-gradient(135deg, rgba(20, 184, 166, .12), rgba(59, 130, 246, .10));
}

.unified-listing-card .ll-card-media img, .unified-listing-card .listing-card-media img { border-radius: inherit; }

.ll-card-fields-panel {
display: block;
padding: .5rem;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 16px;
background: linear-gradient(180deg, rgba(248, 250, 252, .98), rgba(255, 255, 255, .96));
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
}

.ll-card-fields-panel .ll-card-table {
border: 0;
border-radius: 11px;
background: #fff;
}

.ll-card-fields-panel .ll-card-table-row { min-height: 32px; }

.ll-card-user-panel {
background: linear-gradient(180deg, #ffffff, #f8fafc);
border-color: rgba(20, 184, 166, .14);
box-shadow: 0 8px 18px rgba(15, 23, 42, .035);
}

.ll-card-user-row { justify-content: flex-start; }

.ll-card-user-rating {
display: inline-flex;
align-items: center;
flex: 0 0 auto;
margin-left: auto;
padding: .22rem .44rem;
border-radius: 999px;
background: rgba(245, 158, 11, .10);
color: #b45309;
font-size: .76rem;
font-weight: 900;
line-height: 1;
}

.unified-listing-card .listing-featured-ribbon {
top: 18px;
right: -39px;
z-index: 6;
min-width: 142px;
padding: .28rem .56rem;
border: 1px solid rgba(255, 255, 255, .65);
border-radius: 0;
font-size: .64rem;
box-shadow: 0 10px 22px rgba(245, 158, 11, .22);
}

.ll-card-floating-badges .badge-featured { display: none !important; }

.ll-card-variant-owner { grid-template-columns: 158px minmax(0, 1fr); }

.ll-card-variant-owner .ll-card-visual-wrap {
padding: .72rem 0 .72rem .72rem !important;
overflow: visible;
}

.ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual, .ll-card-variant-owner .listing-card-media {
min-height: 164px;
border-radius: 16px !important;
}

.profile-user-listing-card, .profile-user-request-card { grid-template-columns: 144px minmax(0, 1fr); }

@media (max-width: 900px) {

.ll-card-variant-owner .ll-card-visual-wrap, .profile-user-listing-card .ll-card-visual-wrap, .profile-user-request-card .ll-card-visual-wrap { padding: .72rem .72rem 0 !important; }
}

@media (max-width: 560px) {

.ll-card-fields-panel {
padding: .42rem;
border-radius: 14px;
}

.ll-card-user-row { flex-wrap: wrap; }

.ll-card-user-rating { margin-left: 0; }
}

/* Card consistency v5 - force all listing contexts to use the same card template layout */
.owner-listing-grid, .profile-listing-grid { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)) !important; }

.ll-card-context-owner, .ll-card-context-profile, .ll-card-variant-owner, .profile-user-listing-card, .profile-user-request-card {
grid-template-columns: 1fr !important;
grid-template-rows: auto 1fr auto !important;
}

.ll-card-context-owner .ll-card-visual-wrap, .ll-card-context-profile .ll-card-visual-wrap, .ll-card-variant-owner .ll-card-visual-wrap, .profile-user-listing-card .ll-card-visual-wrap, .profile-user-request-card .ll-card-visual-wrap {
grid-row: auto !important;
width: 100% !important;
height: auto !important;
min-height: 0 !important;
padding: .72rem .72rem 0 !important;
}

.ll-card-context-owner .ll-card-media, .ll-card-context-owner .ll-card-icon-visual, .ll-card-context-owner .listing-card-media, .ll-card-context-profile .ll-card-media, .ll-card-context-profile .ll-card-icon-visual, .ll-card-context-profile .listing-card-media, .ll-card-variant-owner .ll-card-media, .ll-card-variant-owner .ll-card-icon-visual, .ll-card-variant-owner .listing-card-media, .profile-user-listing-card .ll-card-media, .profile-user-listing-card .ll-card-icon-visual, .profile-user-listing-card .listing-card-media, .profile-user-request-card .ll-card-media, .profile-user-request-card .ll-card-icon-visual, .profile-user-request-card .listing-card-media {
width: 100% !important;
height: 148px !important;
min-height: 0 !important;
border-radius: 16px !important;
}

.ll-card-context-owner .ll-card-main, .ll-card-context-profile .ll-card-main, .ll-card-variant-owner .ll-card-main, .ll-card-variant-profile .ll-card-main, .profile-user-listing-card .ll-card-main, .profile-user-request-card .ll-card-main { padding: .9rem .95rem .95rem !important; }

.ll-card-context-owner .ll-card-description, .ll-card-context-profile .ll-card-description, .ll-card-variant-owner .ll-card-description, .ll-card-variant-profile .ll-card-description { -webkit-line-clamp: 2 !important; }

.ll-card-context-owner .ll-card-table-row, .ll-card-context-profile .ll-card-table-row, .ll-card-variant-owner .ll-card-table-row {
grid-template-columns: 92px minmax(0, 1fr) !important;
min-height: 32px !important;
}

.ll-card-context-owner .ll-card-footer, .ll-card-context-profile .ll-card-footer, .ll-card-variant-owner .ll-card-footer { padding: 0 .95rem .95rem !important; }

/* === Stay/object split and unified dashboard card usage === */
.stays-heading-actions, .stays-block-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: .75rem;
flex-wrap: wrap;
}

.stays-usage-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 1rem;
margin: 1.25rem 0 1.5rem;
}

.stays-section-block {
margin-top: 1.5rem;
padding: 1rem;
border: 1px solid rgba(15, 23, 42, .08);
border-radius: 22px;
background: rgba(255, 255, 255, .72);
box-shadow: 0 18px 45px rgba(15, 23, 42, .06);
}

.stays-section-block + .stays-section-block { margin-top: 1.75rem; }

.dashboard-card-list.modern-listing-grid {
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 1rem;
}

.dashboard-card-list .unified-listing-card { min-height: 100%; }

.ll-card-kind-object .ll-card-icon-visual .listing-card-icon { background: linear-gradient(135deg, rgba(14, 165, 233, .12), rgba(20, 184, 166, .18)); }

.object-usage-card > span { background: linear-gradient(135deg, rgba(14, 165, 233, .14), rgba(20, 184, 166, .2)); }

@media (max-width: 720px) {

.stays-heading-actions { width: 100%; }

.stays-heading-actions .btn { flex: 1 1 160px; }
}

/* Card refinement v6 - unified request/offer card shell with type accents */
.unified-listing-card.ll-card-kind-offer, .unified-listing-card.ll-card-kind-request {
display: grid !important;
grid-template-columns: 1fr !important;
grid-template-rows: auto 1fr auto !important;
overflow: hidden;
border-width: 1px;
border-style: solid;
}

.unified-listing-card.ll-card-kind-offer {/* background: linear-gradient(180deg, #f7fffd 0%, #ffffff 46%, #ffffff 100%) !important; *//* border-color: rgba(20, 184, 166, .26) !important; */ }

.unified-listing-card.ll-card-kind-request {
background: linear-gradient(180deg, #fff8f3 0%, #ffffff 46%, #ffffff 100%) !important;
border-color: rgba(255, 122, 89, .30) !important;
}

.unified-listing-card.ll-card-kind-offer:hover {
border-color: rgba(20, 184, 166, .46) !important;
box-shadow: 0 18px 42px rgba(20, 184, 166, .12), 0 12px 30px rgba(15, 23, 42, .08);
}

.unified-listing-card.ll-card-kind-request:hover {
border-color: rgba(255, 122, 89, .48) !important;
box-shadow: 0 18px 42px rgba(255, 122, 89, .12), 0 12px 30px rgba(15, 23, 42, .08);
}

.unified-listing-card.ll-card-kind-offer .ll-card-visual-wrap, .unified-listing-card.ll-card-kind-request .ll-card-visual-wrap, .unified-listing-card.ll-card-kind-stay .ll-card-visual-wrap, .unified-listing-card.ll-card-kind-object .ll-card-visual-wrap, .ll-card-context-owner .ll-card-visual-wrap, .ll-card-context-profile .ll-card-visual-wrap {
width: 100% !important;
padding: 0 !important;
overflow: hidden !important;
background: transparent !important;
}

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media, .ll-card-context-owner .ll-card-media, .ll-card-context-owner .ll-card-icon-visual, .ll-card-context-owner .listing-card-media, .ll-card-context-profile .ll-card-media, .ll-card-context-profile .ll-card-icon-visual, .ll-card-context-profile .listing-card-media {
width: 100% !important;
height: 162px !important;
min-height: 162px !important;
margin: 0 !important;
border-radius: 18px 18px 0 0 !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-media img, .unified-listing-card .listing-card-media img {
width: 100% !important;
height: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: 0 !important;
}

.ll-card-media-placeholder {
flex-direction: column;
gap: .55rem;
color: rgba(15, 23, 42, .72);
}

.ll-card-media-placeholder .listing-card-icon {
width: 54px;
height: 54px;
margin: 0;
border-radius: 18px;
background: rgba(255, 255, 255, .86);
box-shadow: 0 14px 30px rgba(15, 23, 42, .10), inset 0 0 0 1px rgba(255,255,255,.72);
}

.ll-card-media-placeholder strong {
font-size: .78rem;
font-weight: 950;
text-transform: uppercase;
letter-spacing: .055em;
}

.ll-card-kind-offer .ll-card-media-placeholder, .ll-card-kind-offer .ll-card-photo-media { background: radial-gradient(circle at 24% 12%, rgba(20, 184, 166, .26), transparent 38%), linear-gradient(135deg, rgba(20, 184, 166, .16), rgba(59, 130, 246, .12)); }

.ll-card-kind-request .ll-card-media-placeholder, .ll-card-kind-request .ll-card-photo-media { background: radial-gradient(circle at 24% 12%, rgba(255, 122, 89, .24), transparent 38%), linear-gradient(135deg, rgba(255, 122, 89, .16), rgba(245, 158, 11, .11)); }

.ll-card-kind-offer .ll-card-topline > .badge, .ll-card-kind-offer .ll-card-primary-pill {
border-color: rgba(20, 184, 166, .22);
background: rgba(20, 184, 166, .10);
color: #0f766e;
}

.ll-card-kind-request .ll-card-topline > .badge, .ll-card-kind-request .ll-card-primary-pill {
border-color: rgba(255, 122, 89, .24);
background: rgba(255, 122, 89, .10);
color: #c2410c;
}

.ll-card-fields-panel {
margin-top: .15rem;
padding: .58rem !important;
border: 1px solid rgba(15, 23, 42, .105) !important;
border-radius: 16px !important;
background: #f8fafc !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 8px 18px rgba(15, 23, 42, .035);
}

.ll-card-kind-offer .ll-card-fields-panel {
border-color: rgba(20, 184, 166, .18) !important;
background: linear-gradient(180deg, rgba(240, 253, 250, .72), rgba(248, 250, 252, .96)) !important;
}

.ll-card-kind-request .ll-card-fields-panel {
border-color: rgba(255, 122, 89, .18) !important;
background: linear-gradient(180deg, rgba(255, 247, 237, .82), rgba(248, 250, 252, .96)) !important;
}

.ll-card-fields-panel .ll-card-table {
overflow: hidden;
border: 1px solid rgba(15, 23, 42, .065) !important;
border-radius: 12px !important;
background: #ffffff !important;
}

.ll-card-fields-panel .ll-card-table-row { min-height: 33px; }

.ll-card-context-owner .ll-card-main, .ll-card-context-profile .ll-card-main, .ll-card-variant-owner .ll-card-main, .ll-card-variant-profile .ll-card-main { padding: .9rem .95rem .95rem !important; }

@media (max-width: 560px) {

.unified-listing-card .ll-card-media, .unified-listing-card .ll-card-icon-visual, .unified-listing-card .listing-card-media {
height: 148px !important;
min-height: 148px !important;
}
}

/* Separate Host stay/object dashboard cards */
.stat-object .stat-icon-modern { background: linear-gradient(135deg, #8b5cf6, #16B8A6); }

.single-usage-grid { grid-template-columns: minmax(0, 1fr); }

.objects-modern-page .object-usage-card {
border-color: rgba(139, 92, 246, .22);
background: linear-gradient(135deg, rgba(139, 92, 246, .08), rgba(22, 184, 166, .08));
}

/* Card refinement v7 - full-width media, readable labels, fixed user panel rhythm */
.unified-listing-card { box-sizing: border-box !important; }

.unified-listing-card > .ll-card-visual-wrap {
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 0 !important;
box-sizing: border-box !important;
overflow: hidden !important;
}

.unified-listing-card > .ll-card-visual-wrap > .ll-card-media, .unified-listing-card > .ll-card-visual-wrap > .ll-card-icon-visual, .unified-listing-card > .ll-card-visual-wrap > .listing-card-media, .unified-listing-card .ll-card-photo-media {
width: 100% !important;
max-width: 100% !important;
height: 168px !important;
min-height: 168px !important;
margin: 0 !important;
flex: 0 0 auto !important;
border-radius: 18px 18px 0 0 !important;
box-sizing: border-box !important;
overflow: hidden !important;
}

.unified-listing-card > .ll-card-visual-wrap > .ll-card-media img, .unified-listing-card > .ll-card-visual-wrap > .listing-card-media img, .unified-listing-card .ll-card-photo-media img {
width: 100% !important;
max-width: 100% !important;
height: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: inherit !important;
}

.unified-listing-card .ll-card-topline { align-items: stretch !important; }

.unified-listing-card .ll-card-topline > .badge, .unified-listing-card .ll-card-primary-pill, .unified-listing-card .ll-card-primary-pill small, .unified-listing-card .ll-card-primary-pill strong, .unified-listing-card .ll-card-table-label, .unified-listing-card .ll-card-table-value, .unified-listing-card .ll-card-user-row .user-name {
overflow: visible !important;
text-overflow: clip !important;
white-space: normal !important;
}

.unified-listing-card .ll-card-primary-pill {
justify-content: center !important;
min-height: 42px !important;
}

.unified-listing-card .ll-card-primary-pill strong {
line-height: 1.18 !important;
word-break: normal !important;
}

.unified-listing-card .ll-card-table-row {
grid-template-columns: minmax(112px, 38%) minmax(0, 1fr) !important;
min-height: 38px !important;
align-items: stretch !important;
}

.unified-listing-card .ll-card-table-label, .unified-listing-card .ll-card-table-value {
display: flex !important;
align-items: center !important;
min-height: 38px !important;
box-sizing: border-box !important;
word-break: normal !important;
overflow-wrap: anywhere !important;
}

.unified-listing-card .ll-card-fields-panel {
margin-top: .35rem !important;
padding: .62rem !important;
}

.unified-listing-card .ll-card-user-panel {
display: grid !important;
grid-template-rows: 13px 30px 24px !important;
align-content: start !important;
gap: .38rem !important;
min-height: 91px !important;
padding: .64rem .72rem !important;
box-sizing: border-box !important;
}

.unified-listing-card .ll-card-user-label {
min-height: 13px !important;
display: flex !important;
align-items: center !important;
}

.unified-listing-card .ll-card-user-row {
display: grid !important;
grid-template-columns: 26px minmax(0, 1fr) auto !important;
align-items: center !important;
gap: .5rem !important;
min-height: 30px !important;
}

.unified-listing-card .ll-card-user-row .user-name {
min-width: 0 !important;
line-height: 1.15 !important;
overflow-wrap: anywhere !important;
}

.unified-listing-card .ll-card-user-rating, .unified-listing-card .ll-card-user-rating-empty {
min-width: 36px !important;
min-height: 20px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: flex-end !important;
margin-left: 0 !important;
}

.unified-listing-card .ll-card-user-badges {
min-height: 24px !important;
display: flex !important;
align-items: center !important;
gap: .35rem !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-badges.is-empty::before {
content: '';
display: block;
height: 1px;
}

@media (max-width: 560px) {

.unified-listing-card > .ll-card-visual-wrap > .ll-card-media, .unified-listing-card > .ll-card-visual-wrap > .ll-card-icon-visual, .unified-listing-card > .ll-card-visual-wrap > .listing-card-media, .unified-listing-card .ll-card-photo-media {
height: 150px !important;
min-height: 150px !important;
}

.unified-listing-card .ll-card-primary-pill {
align-items: flex-start !important;
text-align: left !important;
}

.unified-listing-card .ll-card-topline { flex-direction: column !important; }

.unified-listing-card .ll-card-table-row { grid-template-columns: 1fr !important; }

.unified-listing-card .ll-card-table-label {
border-right: 0 !important;
border-bottom: 1px solid rgba(15, 23, 42, .055) !important;
}
}

/* Card/dashboard refinement v8 - fixed home grid, full-width card media and cleaner user tier */
@media (min-width: 1024px) {

.home-listing-grid.modern-listing-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (min-width: 641px) and (max-width: 1023px) {

.home-listing-grid.modern-listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 640px) {

.home-listing-grid.modern-listing-grid { grid-template-columns: 1fr !important; }
}

.unified-listing-card {
padding: 0 !important;
overflow: hidden !important;
}

.unified-listing-card > .ll-card-visual-wrap {
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 0 !important;
border-radius: 0 !important;
}

.unified-listing-card > .ll-card-visual-wrap > .ll-card-media, .unified-listing-card > .ll-card-visual-wrap > .ll-card-icon-visual, .unified-listing-card > .ll-card-visual-wrap > .listing-card-media, .unified-listing-card .ll-card-photo-media {
width: 100% !important;
max-width: 100% !important;
height: 172px !important;
min-height: 172px !important;
margin: 0 !important;
border-radius: 20px 20px 0 0 !important;
display: flex !important;
}

.unified-listing-card > .ll-card-visual-wrap > .ll-card-media img, .unified-listing-card > .ll-card-visual-wrap > .listing-card-media img, .unified-listing-card .ll-card-photo-media img {
width: 100% !important;
max-width: 100% !important;
height: 100% !important;
object-fit: fill !important;
display: block !important;
}

.unified-listing-card .ll-card-main { padding: .9rem .95rem 1rem !important; }

.unified-listing-card .ll-card-footer { padding: 0 .95rem .95rem !important; }

.unified-listing-card .ll-card-fields-panel {
margin-top: .5rem !important;
margin-bottom: .65rem !important;
padding: .68rem !important;
border-radius: 16px !important;
background: #f8fafc !important;
}

.unified-listing-card .ll-card-user-panel {
grid-template-rows: 13px 44px 24px !important;
min-height: 105px !important;
}

.unified-listing-card .ll-card-user-row {
grid-template-columns: 28px minmax(0, 1fr) auto !important;
min-height: 44px !important;
}

.unified-listing-card .ll-card-user-name-stack {
min-width: 0 !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
gap: .12rem !important;
}

.unified-listing-card .ll-card-user-tier {
display: block !important;
font-size: .72rem !important;
line-height: 1.15 !important;
font-weight: 800 !important;
color: rgba(15, 23, 42, .58) !important;
overflow-wrap: anywhere !important;
}

.unified-listing-card .ll-card-user-tier.is-empty { min-height: .72rem !important; }

.profile-mini-tier {
display: block;
margin-top: .12rem;
font-size: .78rem;
line-height: 1.2;
font-weight: 850;
color: rgba(15, 23, 42, .6);
}

/* v8.1: featured ribbon moved to the left so it does not overlap the floating badges */
.unified-listing-card .listing-featured-ribbon, .listing-card-modern .listing-featured-ribbon {
top: 15px !important;
left: -30px !important;
right: auto !important;
transform: rotate(-35deg) !important;
z-index: 7 !important;
}

.unified-listing-card .ll-card-floating-badges, .listing-card-modern .ll-card-floating-badges {
left: auto !important;
right: .65rem !important;
max-width: calc(100% - 115px) !important;
justify-content: flex-end !important;
}

@media (max-width: 575px) {

.unified-listing-card .listing-featured-ribbon, .listing-card-modern .listing-featured-ribbon {
top: 14px !important;
left: -46px !important;
}

.unified-listing-card .ll-card-floating-badges, .listing-card-modern .ll-card-floating-badges { max-width: calc(100% - 96px) !important; }
}

/* v8.2: user type visibility in shared listing cards */
.profile-icon-guide, .badge-profile-type {
background: rgba(20, 184, 166, .12);
color: #0f766e;
}

.profile-icon-creator {
background: rgba(249, 115, 22, .13);
color: #c2410c;
}

.profile-icon-helper {
background: rgba(34, 197, 94, .13);
color: #15803d;
}

.unified-listing-card .ll-card-primary-pill { width: auto !important; }

/* v8.3: unified user panel and 3-column card grids */
.modern-listing-grid, .results-grid.modern-listing-grid, .home-listing-grid.modern-listing-grid, .offers-grid.modern-listing-grid, .requests-grid.modern-listing-grid, .stays-grid.modern-listing-grid, .offers-list.modern-listing-grid, .requests-list.modern-listing-grid, .favourites-grid.modern-listing-grid, .profile-modern-grid .modern-listing-grid {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 1rem !important;
align-items: stretch !important;
}

.modern-listing-grid > .unified-listing-card, .results-grid.modern-listing-grid > .unified-listing-card, .home-listing-grid.modern-listing-grid > .unified-listing-card, .offers-grid.modern-listing-grid > .unified-listing-card, .requests-grid.modern-listing-grid > .unified-listing-card, .stays-grid.modern-listing-grid > .unified-listing-card, .offers-list.modern-listing-grid > .unified-listing-card, .requests-list.modern-listing-grid > .unified-listing-card, .favourites-grid.modern-listing-grid > .unified-listing-card, .profile-modern-grid .modern-listing-grid > .unified-listing-card {
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
height: 100% !important;
}

.unified-listing-card .ll-card-primary-pill {
max-width: none !important;
white-space: normal !important;
overflow: visible !important;
text-overflow: clip !important;
}

.unified-listing-card .ll-card-primary-pill small, .unified-listing-card .ll-card-primary-pill strong {
max-width: none !important;
white-space: normal !important;
overflow: visible !important;
text-overflow: clip !important;
}

.unified-listing-card .ll-card-user-panel {
display: grid !important;
grid-template-rows: 14px minmax(46px, auto) 24px !important;
min-height: 112px !important;
height: 112px !important;
align-content: start !important;
}

.unified-listing-card .ll-card-user-row {
display: grid !important;
grid-template-columns: 30px minmax(0, 1fr) 58px !important;
column-gap: .55rem !important;
align-items: center !important;
min-height: 46px !important;
}

.unified-listing-card .ll-card-user-name-stack {
min-height: 42px !important;
justify-content: center !important;
}

.unified-listing-card .ll-card-user-badges, .unified-listing-card .ll-card-user-badges.is-empty {
display: flex !important;
align-items: center !important;
min-height: 24px !important;
height: 24px !important;
margin-top: .35rem !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-badges.is-empty::before {
content: '' !important;
display: block !important;
width: 1px !important;
height: 1px !important;
}

.unified-listing-card .ll-card-user-rating, .unified-listing-card .ll-card-user-rating-empty {
width: 58px !important;
min-width: 58px !important;
justify-content: center !important;
text-align: center !important;
}

@media (max-width: 1100px) {

.modern-listing-grid, .results-grid.modern-listing-grid, .home-listing-grid.modern-listing-grid, .offers-grid.modern-listing-grid, .requests-grid.modern-listing-grid, .stays-grid.modern-listing-grid, .offers-list.modern-listing-grid, .requests-list.modern-listing-grid, .favourites-grid.modern-listing-grid, .profile-modern-grid .modern-listing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 700px) {

.modern-listing-grid, .results-grid.modern-listing-grid, .home-listing-grid.modern-listing-grid, .offers-grid.modern-listing-grid, .requests-grid.modern-listing-grid, .stays-grid.modern-listing-grid, .offers-list.modern-listing-grid, .requests-list.modern-listing-grid, .favourites-grid.modern-listing-grid, .profile-modern-grid .modern-listing-grid { grid-template-columns: 1fr !important; }
}

/* v8.4: linked category/location values inside shared listing cards */
.unified-listing-card .ll-card-field-link {
display: inline-flex !important;
align-items: center !important;
width: 100% !important;
color: #0f766e !important;
text-decoration: none !important;
font-weight: 850 !important;
border-radius: 10px !important;
transition: color .18s ease, background .18s ease, box-shadow .18s ease;
}

.unified-listing-card .ll-card-field-link:hover {
color: #0f4f49 !important;
background: rgba(20, 184, 166, .09) !important;
box-shadow: 0 0 0 4px rgba(20, 184, 166, .06) !important;
}

.unified-listing-card .ll-row-location .ll-card-field-link { color: #2563eb !important; }

.unified-listing-card .ll-row-location .ll-card-field-link:hover {
color: #1d4ed8 !important;
background: rgba(37, 99, 235, .08) !important;
box-shadow: 0 0 0 4px rgba(37, 99, 235, .055) !important;
}

/* v8.5: dynamic listing grids and top explore filters */
.modern-listing-grid, .results-grid.modern-listing-grid, .home-listing-grid.modern-listing-grid, .offers-grid.modern-listing-grid, .requests-grid.modern-listing-grid, .stays-grid.modern-listing-grid, .offers-list.modern-listing-grid, .requests-list.modern-listing-grid, .favourites-grid.modern-listing-grid, .profile-listing-grid.modern-listing-grid, .profile-modern-grid .modern-listing-grid, .dashboard-card-list.modern-listing-grid, .owner-listing-grid {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(385px, 1fr)) !important;
gap: 1rem !important;
align-items: stretch !important;
}

.explore-container.explore-top-filter-layout {
display: block !important;
 width: min(calc(100% - (var(--gutter, 24px) * 2)), var(--container-wide, 1280px)) !important;
max-width: var(--container-wide, 1280px) !important;
padding: 36px 0 72px !important;
}

.explore-top-filter-layout .explore-sidebar, .explore-top-filter-layout .explore-filter-panel {
position: relative !important;
top: auto !important;
width: 100% !important;
margin: 0 0 24px !important;
padding: 22px !important;
border-radius: 30px !important;
border: 1px solid rgba(15, 23, 42, .08) !important;
background: radial-gradient(circle at top left, rgba(20, 184, 166, .13), transparent 34%), linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .96)) !important;
box-shadow: 0 20px 60px rgba(15, 23, 42, .08) !important;
backdrop-filter: blur(16px) !important;
}

.explore-filter-panel-header {
display: flex !important;
align-items: flex-end !important;
justify-content: space-between !important;
gap: 18px !important;
margin-bottom: 18px !important;
}

.explore-filter-panel-header h3 {
margin: 4px 0 0 !important;
color: var(--navy, #0f172a) !important;
font-size: clamp(1.35rem, 2vw, 1.9rem) !important;
line-height: 1.05 !important;
letter-spacing: -.045em !important;
}

.explore-filter-panel-header p {
max-width: 520px !important;
margin: 0 !important;
color: var(--muted, #64748b) !important;
font-weight: 650 !important;
line-height: 1.55 !important;
}

.explore-filter-panel .section-kicker {
display: inline-flex !important;
align-items: center !important;
gap: .4rem !important;
font-size: .72rem !important;
font-weight: 950 !important;
text-transform: uppercase !important;
letter-spacing: .11em !important;
color: #0f766e !important;
}

.explore-top-filter-layout .explore-sidebar .filter-form, .explore-top-filter-layout .explore-filter-form {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)) !important;
gap: 14px !important;
align-items: end !important;
}

.explore-filter-form .filter-group { min-width: 0 !important; }

.explore-filter-form .checkbox-group {
min-height: 48px !important;
display: flex !important;
align-items: center !important;
padding: 0 14px !important;
border: 1px solid rgba(15, 23, 42, .08) !important;
border-radius: 16px !important;
background: rgba(255, 255, 255, .72) !important;
}

.explore-filter-actions {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 10px !important;
align-items: end !important;
}

.explore-filter-actions .btn {
width: 100% !important;
min-height: 48px !important;
justify-content: center !important;
white-space: nowrap !important;
}

.explore-top-filter-layout .explore-main { min-width: 0 !important; }

.explore-top-filter-layout .active-filters { margin: 0 0 18px !important; }

@media (max-width: 760px) {

.modern-listing-grid, .results-grid.modern-listing-grid, .home-listing-grid.modern-listing-grid, .offers-grid.modern-listing-grid, .requests-grid.modern-listing-grid, .stays-grid.modern-listing-grid, .offers-list.modern-listing-grid, .requests-list.modern-listing-grid, .favourites-grid.modern-listing-grid, .profile-listing-grid.modern-listing-grid, .profile-modern-grid .modern-listing-grid, .dashboard-card-list.modern-listing-grid, .owner-listing-grid { grid-template-columns: 1fr !important; }

.explore-container.explore-top-filter-layout {
width: min(calc(100% - 28px), var(--container-wide, 1280px)) !important;
padding-top: 22px !important;
}

.explore-filter-panel-header { display: block !important; }

.explore-filter-panel-header p { margin-top: 10px !important; }

.explore-top-filter-layout .explore-sidebar .filter-form, .explore-top-filter-layout .explore-filter-form, .explore-filter-actions { grid-template-columns: 1fr !important; }
}

/* v8.6: homepage categories use real site categories and responsive columns */
.category-grid, .service-category-grid {
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
align-items: stretch !important;
}

.category-card { min-height: 100% !important; }

.category-card-count {
display: inline-flex !important;
align-items: center !important;
margin-top: 14px !important;
padding: 7px 11px !important;
border-radius: 999px !important;
background: rgba(20, 184, 166, .1) !important;
color: #0f766e !important;
font-size: .78rem !important;
font-weight: 900 !important;
}

/* v9.4: user card panel themes by profile type/admin selection */
.unified-listing-card .ll-card-user-panel {
 --ll-user-panel-bg: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
 --ll-user-panel-border: rgba(15, 23, 42, .08);
 --ll-user-panel-accent: #64748b;
 --ll-user-panel-soft: rgba(100, 116, 139, .10);
background: var(--ll-user-panel-bg) !important;
border-color: var(--ll-user-panel-border) !important;
box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 10px 22px rgba(15, 23, 42, .045) !important;
}

.unified-listing-card .ll-card-user-panel::before {
content: '';
display: block;
position: absolute;
inset: 0 auto 0 0;
width: 4px;
border-radius: inherit;
background: var(--ll-user-panel-accent);
opacity: .95;
}

.unified-listing-card .ll-card-user-panel .ll-card-user-label, .unified-listing-card .ll-card-user-panel .ll-card-user-tier { color: color-mix(in srgb, var(--ll-user-panel-accent) 76%, #0f172a 24%) !important; }

.unified-listing-card .ll-card-user-panel .ll-card-user-rating {
background: var(--ll-user-panel-soft) !important;
color: color-mix(in srgb, var(--ll-user-panel-accent) 82%, #111827 18%) !important;
}

.unified-listing-card .ll-card-user-panel .user-mini-icon {
background: var(--ll-user-panel-soft) !important;
color: color-mix(in srgb, var(--ll-user-panel-accent) 88%, #111827 12%) !important;
}

.unified-listing-card .ll-card-user-theme-traveller { --ll-user-panel-bg: linear-gradient(135deg, #f8fbff 0%, #eef6ff 100%);
 --ll-user-panel-border: rgba(37, 99, 235, .18);
 --ll-user-panel-accent: #2563eb;
 --ll-user-panel-soft: rgba(37, 99, 235, .10);
}

.unified-listing-card .ll-card-user-theme-pro_traveller { --ll-user-panel-bg: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
 --ll-user-panel-border: rgba(249, 115, 22, .22);
 --ll-user-panel-accent: #ea580c;
 --ll-user-panel-soft: rgba(249, 115, 22, .13);
}

.unified-listing-card .ll-card-user-theme-host { --ll-user-panel-bg: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
 --ll-user-panel-border: rgba(16, 185, 129, .24);
 --ll-user-panel-accent: #059669;
 --ll-user-panel-soft: rgba(16, 185, 129, .13);
}

.unified-listing-card .ll-card-user-theme-guide { --ll-user-panel-bg: linear-gradient(135deg, #f0fdfa 0%, #ccfbf1 100%);
 --ll-user-panel-border: rgba(20, 184, 166, .24);
 --ll-user-panel-accent: #0f766e;
 --ll-user-panel-soft: rgba(20, 184, 166, .13);
}

.unified-listing-card .ll-card-user-theme-creator { --ll-user-panel-bg: linear-gradient(135deg, #fdf4ff 0%, #fae8ff 100%);
 --ll-user-panel-border: rgba(192, 38, 211, .22);
 --ll-user-panel-accent: #a21caf;
 --ll-user-panel-soft: rgba(192, 38, 211, .12);
}

.unified-listing-card .ll-card-user-theme-helper { --ll-user-panel-bg: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
 --ll-user-panel-border: rgba(34, 197, 94, .24);
 --ll-user-panel-accent: #16a34a;
 --ll-user-panel-soft: rgba(34, 197, 94, .13);
}

.unified-listing-card .ll-card-user-panel {
position: relative !important;
overflow: hidden !important;
padding-left: .82rem !important;
}

.unified-listing-card .ll-card-user-panel::before { pointer-events: none; }

/* v9.8: Business package/profile support */
.profile-icon-business, .badge-business {
background: rgba(79, 70, 229, .13);
color: #4338ca;
}

.unified-listing-card .ll-card-user-theme-business { --ll-user-panel-bg: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%);
 --ll-user-panel-border: rgba(79, 70, 229, .24);
 --ll-user-panel-accent: #4f46e5;
 --ll-user-panel-soft: rgba(79, 70, 229, .13);
}

.unified-listing-card.ll-card-kind-business {
border-color: rgba(79, 70, 229, .22) !important;
background: linear-gradient(180deg, rgba(238,242,255,.82), rgba(255,255,255,.96)) !important;
}

.unified-listing-card.ll-card-kind-business .badge-info, .unified-listing-card.ll-card-kind-business .ll-card-primary-pill {
background: rgba(79, 70, 229, .10) !important;
color: #3730a3 !important;
}

.dashboard-stat-card.stat-business {
background: linear-gradient(135deg, rgba(79,70,229,.12), rgba(255,255,255,.98));
border-color: rgba(79,70,229,.18);
}

.business-usage-card > span, .businesses-modern-page .empty-icon { color: #4f46e5; }

/* Auth footer button alignment */
.auth-footer-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 12px;
margin-top: 20px;
}

.auth-footer-text {
color: var(--muted);
font-size: .95rem;
}

.auth-footer-button {
width: auto;
min-width: 140px;
justify-content: center;
}

@media (max-width: 560px) {

.auth-footer-actions {
align-items: stretch;
flex-direction: column;
}

.auth-footer-button { width: 100%; }
}

/* v10.0: normalize listing user panel height in every card context */
.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel, .unified-listing-card.ll-card-variant-public .ll-card-user-panel, .unified-listing-card.ll-card-variant-profile .ll-card-user-panel, .unified-listing-card.ll-card-variant-owner .ll-card-user-panel {
display: grid !important;
grid-template-rows: 38px 22px !important;
grid-template-columns: minmax(0, 1fr) !important;
align-content: start !important;
gap: .35rem !important;
width: 100% !important;
min-width: 0 !important;
height: 88px !important;
min-height: 88px !important;
max-height: 88px !important;
margin-top: .55rem !important;
padding: .56rem .7rem .56rem .86rem !important;
box-sizing: border-box !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-panel .ll-card-user-label { display: none !important; }

.unified-listing-card .ll-card-user-row, .unified-listing-card.ll-card-context-public .ll-card-user-row, .unified-listing-card.ll-card-context-profile .ll-card-user-row, .unified-listing-card.ll-card-context-owner .ll-card-user-row {
display: grid !important;
grid-template-columns: 28px minmax(0, 1fr) 52px !important;
align-items: center !important;
column-gap: .5rem !important;
width: 100% !important;
min-width: 0 !important;
height: 38px !important;
min-height: 38px !important;
max-height: 38px !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-name-stack {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
gap: .08rem !important;
min-width: 0 !important;
height: 38px !important;
min-height: 38px !important;
max-height: 38px !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-row .user-name, .unified-listing-card .ll-card-user-tier {
display: block !important;
max-width: 100% !important;
min-width: 0 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
overflow-wrap: normal !important;
}

.unified-listing-card .ll-card-user-row .user-name {
font-size: .84rem !important;
line-height: 1.08 !important;
}

.unified-listing-card .ll-card-user-tier {
min-height: 13px !important;
font-size: .68rem !important;
line-height: 1.05 !important;
}

.unified-listing-card .ll-card-user-tier.is-empty {
min-height: 13px !important;
height: 13px !important;
}

.unified-listing-card .ll-card-user-rating, .unified-listing-card .ll-card-user-rating-empty {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 52px !important;
min-width: 52px !important;
max-width: 52px !important;
height: 22px !important;
min-height: 22px !important;
max-height: 22px !important;
margin-left: 0 !important;
padding: .16rem .3rem !important;
box-sizing: border-box !important;
overflow: hidden !important;
white-space: nowrap !important;
}

.unified-listing-card .ll-card-user-badges, .unified-listing-card .ll-card-user-badges.is-empty {
display: flex !important;
align-items: center !important;
flex-wrap: nowrap !important;
gap: .3rem !important;
width: 100% !important;
min-width: 0 !important;
height: 22px !important;
min-height: 22px !important;
max-height: 22px !important;
margin-top: 0 !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-badges .badge, .unified-listing-card .ll-card-user-badges span {
flex: 0 1 auto !important;
max-width: 100% !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}

.unified-listing-card .ll-card-user-badges.is-empty::before {
content: '' !important;
display: block !important;
width: 1px !important;
height: 1px !important;
}

@media (max-width: 560px) {

.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel {
height: 88px !important;
min-height: 88px !important;
max-height: 88px !important;
}
}

/* v10.1: keep listing card user panel on a single compact row in every context */
.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel, .unified-listing-card.ll-card-variant-public .ll-card-user-panel, .unified-listing-card.ll-card-variant-profile .ll-card-user-panel, .unified-listing-card.ll-card-variant-owner .ll-card-user-panel {
display: flex !important;
align-items: center !important;
gap: 0 !important;
height: 56px !important;
min-height: 56px !important;
max-height: 56px !important;
padding: .48rem .68rem .48rem .86rem !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-row, .unified-listing-card.ll-card-context-public .ll-card-user-row, .unified-listing-card.ll-card-context-profile .ll-card-user-row, .unified-listing-card.ll-card-context-owner .ll-card-user-row {
display: grid !important;
grid-template-columns: 28px minmax(0, 1fr) 52px !important;
align-items: center !important;
column-gap: .5rem !important;
width: 100% !important;
height: 34px !important;
min-height: 34px !important;
max-height: 34px !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-name-stack {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: flex-start !important;
gap: .38rem !important;
height: 34px !important;
min-height: 34px !important;
max-height: 34px !important;
min-width: 0 !important;
overflow: hidden !important;
}

.unified-listing-card .ll-card-user-name-stack .user-name {
flex: 1 1 auto !important;
min-width: 0 !important;
max-width: 100% !important;
white-space: nowrap !important;
}

.unified-listing-card .ll-card-user-tier {
flex: 0 0 auto !important;
display: inline-flex !important;
align-items: center !important;
max-width: 42% !important;
min-height: 0 !important;
height: auto !important;
padding: .12rem .36rem !important;
border-radius: 999px !important;
background: var(--ll-user-panel-soft) !important;
font-size: .66rem !important;
line-height: 1 !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}

.unified-listing-card .ll-card-user-tier.is-empty, .unified-listing-card .ll-card-user-badges, .unified-listing-card .ll-card-user-badges.is-empty, .unified-listing-card .ll-card-user-badges.is-empty::before { display: none !important; }

@media (max-width: 560px) {

.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel {
height: 56px !important;
min-height: 56px !important;
max-height: 56px !important;
}
}

/* v11.0: keep user tier below the user name and do not shorten the user name */
.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel, .unified-listing-card.ll-card-variant-public .ll-card-user-panel, .unified-listing-card.ll-card-variant-profile .ll-card-user-panel, .unified-listing-card.ll-card-variant-owner .ll-card-user-panel {
display: flex !important;
align-items: center !important;
height: 76px !important;
min-height: 76px !important;
max-height: 76px !important;
padding: .5rem .68rem .5rem .86rem !important;
overflow: visible !important;
}

.unified-listing-card .ll-card-user-row, .unified-listing-card.ll-card-context-public .ll-card-user-row, .unified-listing-card.ll-card-context-profile .ll-card-user-row, .unified-listing-card.ll-card-context-owner .ll-card-user-row {
display: grid !important;
grid-template-columns: 28px minmax(0, 1fr) 52px !important;
align-items: center !important;
column-gap: .5rem !important;
width: 100% !important;
min-width: 0 !important;
height: 54px !important;
min-height: 54px !important;
max-height: none !important;
overflow: visible !important;
}

.unified-listing-card .ll-card-user-name-stack {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: center !important;
gap: .16rem !important;
height: auto !important;
min-height: 42px !important;
max-height: none !important;
min-width: 0 !important;
max-width: 100% !important;
overflow: visible !important;
}

.unified-listing-card .ll-card-user-name-stack .user-name, .unified-listing-card .ll-card-user-row .user-name {
display: block !important;
flex: 0 1 auto !important;
min-width: 0 !important;
max-width: 100% !important;
width: auto !important;
white-space: normal !important;
overflow: visible !important;
text-overflow: clip !important;
overflow-wrap: anywhere !important;
word-break: normal !important;
line-height: 1.12 !important;
}

.unified-listing-card .ll-card-user-tier {
display: inline-flex !important;
align-items: center !important;
flex: 0 0 auto !important;
width: auto !important;
max-width: 100% !important;
min-height: 0 !important;
height: auto !important;
margin-top: 0 !important;
padding: .12rem .36rem !important;
border-radius: 999px !important;
background: var(--ll-user-panel-soft) !important;
font-size: .66rem !important;
line-height: 1 !important;
white-space: nowrap !important;
overflow: visible !important;
text-overflow: clip !important;
}

.unified-listing-card .ll-card-user-rating, .unified-listing-card .ll-card-user-rating-empty { align-self: center !important; }

@media (max-width: 560px) {

.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel {
height: 76px !important;
min-height: 76px !important;
max-height: 76px !important;
}
}

/* Profile package change request */
.profile-package-request-section .profile-package-current, .profile-package-request-section .profile-package-pending { margin-bottom: 10px }

.profile-package-request-section .profile-package-pending {
color: rgb(255 110 77);
font-weight: 900
}

/* v14.0: dashboard numbers, auth rows, wizard, offer detail, conversation compose */
.auth-button-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
flex-wrap: nowrap;
margin-top: 20px;
}

.auth-button-row .btn, .auth-main-button, .auth-side-button {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 0;
}

.auth-main-button, .auth-side-button { flex: 1 1 0; }

.auth-checkbox-label {
display: flex !important;
align-items: flex-start !important;
gap: 10px !important;
width: 100% !important;
}

.auth-checkbox-label input[type="checkbox"] {
flex: 0 0 auto !important;
margin-top: .2rem !important;
}

.auth-checkbox-label .checkbox-label-text {
display: block !important;
min-width: 0 !important;
line-height: 1.45 !important;
column-count: auto !important;
columns: auto !important;
}

.dashboard-stats-grid { counter-reset: dashboardStat; }

.dashboard-stat-card { isolation: isolate; }

.dashboard-stat-card > * {
position: relative;
z-index: 2;
}

.dashboard-stat-card::before {
counter-increment: dashboardStat;
content: counter(dashboardStat);
position: absolute;
right: 18px;
bottom: -14px;
z-index: 0;
color: currentColor;
opacity: .08;
font-size: clamp(4.2rem, 9vw, 7.5rem);
line-height: .8;
font-weight: 950;
letter-spacing: -.08em;
pointer-events: none;
}

.listing-wizard {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
margin: 16px 0 22px;
}

.listing-wizard-step {
display: flex;
align-items: center;
gap: 12px;
padding: 14px;
border: 1px solid var(--line);
border-radius: 22px;
background: #fff;
box-shadow: var(--shadow-xs);
text-decoration: none;
color: inherit;
}

.listing-wizard-step b {
display: grid;
place-items: center;
width: 38px;
height: 38px;
border-radius: 14px;
background: #f1f5f9;
color: var(--muted);
font-size: 1.1rem;
font-weight: 950;
flex: 0 0 auto;
}

.listing-wizard-step span {
min-width: 0;
display: grid;
gap: 2px;
}

.listing-wizard-step strong {
color: var(--navy);
font-weight: 950;
line-height: 1.15;
}

.listing-wizard-step small {
color: var(--muted);
font-size: .78rem;
font-weight: 750;
line-height: 1.25;
}

.listing-wizard-step.is-active {
border-color: rgba(22, 184, 166, .35);
background: linear-gradient(135deg, rgba(22,184,166,.12), #fff);
}

.listing-wizard-step.is-active b {
background: var(--teal);
color: #fff;
}

.listing-wizard-step.is-complete { border-color: rgba(255, 110, 77, .28); }

.listing-wizard-step.is-complete b {
background: rgba(255,110,77,.13);
color: rgb(255 110 77);
}

.domus-parameters-grid, .info-tile-grid.offer-parameters-grid.domus-parameters-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.domus-stay-card-inline { margin: 0 0 1.25rem; }

.conversation-modern-wrap { padding-bottom: 210px; }

.conversation-thread { padding-bottom: 120px; }

.conversation-compose {
position: relative;
left: 50%;
transform: translateX(-50%);
z-index: 950;/* width: min(calc(100% - 28px), 1180px); *//* border: 1px solid var(--line); */
border-bottom: 0;/* border-radius: 24px 24px 0 0; */
box-shadow: 0 -18px 48px rgba(15, 23, 42, .13);
}

.conversation-compose textarea {
min-height: 74px;
max-height: 26vh;
}

@media (max-width: 820px) {

.listing-wizard { grid-template-columns: 1fr; }

.domus-parameters-grid, .info-tile-grid.offer-parameters-grid.domus-parameters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {

.auth-button-row { gap: 8px; }

.auth-main-button, .auth-side-button {
padding-left: 10px;
padding-right: 10px;
font-size: .9rem;
}

.domus-parameters-grid, .info-tile-grid.offer-parameters-grid.domus-parameters-grid { grid-template-columns: 1fr; }

.conversation-modern-wrap { padding-bottom: 230px; }

.conversation-compose {
width: calc(100% - 18px);
padding: 14px;
border-radius: 20px 20px 0 0;
}
}

/* v15 conversation/add-stay refinements */
.conversation-thread.has-empty-arrow {
position: relative;
align-content: stretch;
overflow: hidden;
background: radial-gradient(circle at 50% 24%, rgba(255, 110, 77, .12), transparent 34%), linear-gradient(180deg, #fff, #fff7f3);
}

.conversation-empty-arrow {
position: relative;/* min-height: min(48vh, 460px); */
display: grid;
place-items: center;
text-align: center;
isolation: isolate;
color: var(--navy);
margin-top: -250px;
}

.conversation-empty-arrow-symbol {
position: absolute;
left: 50%;
bottom: 128px;
transform: translateX(-50%);
z-index: -1;
font-size: clamp(170px, 30vw, 360px);
line-height: .75;
font-weight: 1000;
color: rgba(255, 110, 77, .2);
text-shadow: 0 22px 50px rgba(255, 110, 77, .2);
}

.conversation-empty-arrow-text {
width: min(420px, 92%);
padding: 22px 24px;
border: 1px solid rgba(255, 110, 77, .24);
border-radius: 28px;
background: rgba(255, 255, 255, .86);
box-shadow: 0 18px 44px rgba(15, 23, 42, .08);
backdrop-filter: blur(10px);
}

.conversation-empty-arrow-text strong {
display: block;
margin-bottom: 6px;
font-size: 1.12rem;
font-weight: 950;
}

.conversation-empty-arrow-text p {
margin: 0;
color: var(--muted);
font-weight: 750;
line-height: 1.45;
}

.conversation-compose.conversation-compose-modern {
display: grid;
gap: 10px;
border-color: rgba(255, 110, 77, .34);
background: linear-gradient(180deg, #fff, #fff7f3);
box-shadow: 0 -20px 56px rgba(255, 110, 77, .16), 0 -12px 36px rgba(15, 23, 42, .08);
}

.compose-field-label {
font-size: .82rem;
font-weight: 950;
color: rgb(255 110 77);
letter-spacing: .08em;
text-transform: uppercase;
}

.compose-input-row {
display: grid;
grid-template-columns: 1fr auto;
align-items: stretch;
gap: 12px;
}

.conversation-compose.conversation-compose-modern textarea {
min-height: 72px;
border: 2px solid rgb(255 110 77);
background: #fff;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75);
}

.conversation-compose.conversation-compose-modern textarea:focus {
border-color: rgb(255 110 77);
box-shadow: 0 0 0 4px rgba(255, 110, 77, .14);
}

.compose-send-button {
min-width: 148px;
border-radius: 20px;
}

.conversation-compose.conversation-compose-modern .compose-actions {
justify-content: flex-start;
margin-top: 0;
}

@media (max-width: 640px) {

.conversation-empty-arrow-symbol {
bottom: -8px;
font-size: clamp(150px, 48vw, 260px);
}

.compose-input-row { grid-template-columns: 1fr; }

.compose-send-button {
width: 100%;
min-width: 0;
}
}

/* v16 wizard and offer availability refinements */
.listing-wizard-step {
position: relative;
transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.listing-wizard-step.is-active {
transform: scale(1.045);
z-index: 2;
padding: 18px;
border-color: rgb(255 110 77);
background: radial-gradient(circle at 12% 15%, rgba(255, 110, 77, .20), transparent 42%), linear-gradient(135deg, rgba(255, 110, 77, .14), rgba(22,184,166,.08), #fff);
box-shadow: 0 18px 42px rgba(255, 110, 77, .18), var(--shadow-sm);
}

.listing-wizard-step.is-active::after {
content: '';
position: absolute;
inset: -5px;
border: 2px solid rgba(255, 110, 77, .32);
border-radius: 26px;
pointer-events: none;
}

.listing-wizard-step.is-active b {
width: 48px;
height: 48px;
border-radius: 18px;
background: rgb(255 110 77);
box-shadow: 0 10px 24px rgba(255, 110, 77, .28);
font-size: 1.35rem;
}

.listing-wizard-step.is-active strong { color: rgb(255 110 77); }

.availability-date-range { align-items: flex-start; }

@media (max-width: 760px) {

.listing-wizard-step.is-active { transform: none; }
}

/* v18 shared 3-month inline availability calendar */
.availability-calendar-panel {
padding: 18px;
border: 1px solid rgba(255, 110, 77, .24);
border-radius: 24px;
background: linear-gradient(135deg, rgba(255, 110, 77, .08), rgba(22, 184, 166, .06), #fff);
box-shadow: var(--shadow-sm);
}

.availability-calendar-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 16px;
margin-bottom: 14px;
}

.availability-calendar-head strong {
display: block;
font-size: 1rem;
font-weight: 950;
color: var(--text-dark);
}

.availability-calendar-head span {
display: block;
margin-top: 4px;
font-size: .88rem;
color: var(--text-light);
}

.availability-calendar-nav {
display: inline-flex;
gap: 8px;
flex-shrink: 0;
}

.availability-calendar-btn {
width: 42px;
height: 42px;
border: 1px solid rgba(255, 110, 77, .34);
border-radius: 14px;
background: #fff;
color: rgb(255 110 77);
font-size: 1.55rem;
font-weight: 900;
line-height: 1;
cursor: pointer;
transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.availability-calendar-btn:hover {
transform: translateY(-1px);
background: rgba(255, 110, 77, .08);
box-shadow: 0 10px 24px rgba(255, 110, 77, .14);
}

.availability-calendar-selected {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 16px;
}

.availability-calendar-selected span {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 12px;
border-radius: 999px;
background: rgba(255, 255, 255, .84);
border: 1px solid rgba(255, 110, 77, .18);
color: var(--text-light);
font-size: .88rem;
font-weight: 800;
}

.availability-calendar-selected strong {
color: rgb(255 110 77);
font-weight: 950;
}

.availability-calendar-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
}

.availability-month {
padding: 14px;
border-radius: 20px;
background: #fff;
border: 1px solid rgba(15, 23, 42, .08);
}

.availability-month-title {
margin-bottom: 12px;
text-align: center;
font-weight: 950;
color: var(--text-dark);
text-transform: capitalize;
}

.availability-weekdays, .availability-days {
display: grid;
grid-template-columns: repeat(7, minmax(0, 1fr));
gap: 6px;
}

.availability-weekdays span {
text-align: center;
font-size: .72rem;
font-weight: 950;
color: var(--text-light);
text-transform: uppercase;
}

.availability-day {
min-height: 38px;
border: 1px solid transparent;
border-radius: 12px;
background: rgba(17, 24, 39, .035);
color: var(--text-dark);
font-weight: 850;
cursor: pointer;
transition: transform .14s ease, background .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease;
}

.availability-day:not(.is-empty):hover {
transform: translateY(-1px);
border-color: rgba(255, 110, 77, .32);
background: rgba(255, 110, 77, .10);
}

.availability-day.is-empty {
background: transparent;
pointer-events: none;
}

.availability-day.is-start, .availability-day.is-end {
background: rgb(255 110 77);
border-color: rgb(255 110 77);
color: #fff;
box-shadow: 0 10px 24px rgba(255, 110, 77, .24);
}

.availability-day.is-in-range {
background: rgba(22, 184, 166, .18);
border-color: rgba(22, 184, 166, .22);
color: #0f766e;
}

.availability-day.is-awaiting-end { outline: 3px solid rgba(255, 110, 77, .16); }

@media (max-width: 1180px) {

.availability-calendar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {

.availability-calendar-panel {
padding: 14px;
border-radius: 20px;
}

.availability-calendar-head { flex-direction: column; }

.availability-calendar-nav {
width: 100%;
justify-content: space-between;
}

.availability-calendar-grid { grid-template-columns: 1fr; }

.availability-day {
min-height: 36px;
border-radius: 10px;
}
}

.form-time-after-calendar { margin-top: 16px; }

/* v19 modern listing wizard and compact add-listing forms */
.listing-wizard.listing-wizard-modern {
position: relative;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: clamp(10px, 1.8vw, 18px);
margin: 10px 0 20px;
padding: 20px;
border-radius: 30px;
background: linear-gradient(135deg, rgba(255, 255, 255, .92), rgba(248, 250, 252, .78)), radial-gradient(circle at 8% 0%, rgba(255, 110, 77, .13), transparent 35%), radial-gradient(circle at 92% 0%, rgba(22, 184, 166, .12), transparent 38%);
box-shadow: 0 18px 45px rgba(15, 23, 42, .08);
overflow: visible;
}

.listing-wizard.listing-wizard-modern::before, .listing-wizard.listing-wizard-modern::after {
content: '';
position: absolute;
left: calc(10px + 16.66%);
right: calc(10px + 16.66%);
top: 50%;
height: 6px;
border-radius: 999px;
transform: translateY(-50%);
pointer-events: none;
}

.listing-wizard.listing-wizard-modern::before { background: rgba(15, 23, 42, .07); }

.listing-wizard.listing-wizard-modern::after {
right: auto;
 width: calc((100% - 20px - 33.32%) * var(--wizard-progress, 0) / 100);
background: linear-gradient(90deg, rgb(255 110 77), var(--teal));
box-shadow: 0 8px 24px rgba(255, 110, 77, .18);
}

.listing-wizard.listing-wizard-modern .listing-wizard-step {
position: relative;
z-index: 2;
min-height: 88px;
padding: 13px 14px;
border: 1px solid rgb(15 23 42 / 21%);
border-radius: 24px;
background: rgba(255, 255, 255, .92);
box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
transition: transform .18s ease, box-shadow .18s ease, background .18s ease, opacity .18s ease;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step b {
width: 42px;
height: 42px;
border-radius: 16px;
background: #f1f5f9;
color: #64748b;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.listing-wizard.listing-wizard-modern .listing-wizard-step strong {
font-size: .94rem;
letter-spacing: -.02em;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step small {
max-width: 21ch;
font-size: .72rem;
opacity: .86;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-complete {
border-color: rgba(22, 184, 166, .12);
background: linear-gradient(135deg, rgba(22, 184, 166, .10), rgba(255, 255, 255, .94));
}

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-complete b {
background: var(--teal);
color: #fff;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active {/* transform: scale(1.07); */
z-index: 4;
padding: 13px 14px;
border-color: rgba(15, 23, 42, .06) !important;
background: radial-gradient(circle at 15% 15%, rgba(255, 110, 77, .22), transparent 42%), linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(255, 247, 243, .98));/* box-shadow: 0 20px 48px rgba(255, 110, 77, .18), 0 14px 38px rgba(15, 23, 42, .10); */
}

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active::after { display: none !important; }

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active b {
width: 60px;
height: 60px;
border-radius: 18px;
background: rgb(255 110 77);
color: #fff;
box-shadow: 0 12px 26px rgba(255, 110, 77, .28);
}

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active strong { color: rgb(255 110 77); }
 .form-container:has(.form-stay), .form-container:has(.form-offer), .form-container:has(.form-request) {
 padding: clamp(16px, 2vw, 24px);
 border-radius: 30px;
 background:
 linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .92)), radial-gradient(circle at 0 0, rgba(255, 110, 77, .07), transparent 30%);
}

.form-stay, .form-offer, .form-request {
display: grid;
gap: 14px;
}

.form-stay .form-section, .form-offer .form-section, .form-request .form-section {
display: grid;
grid-template-columns: repeat(1, minmax(0, 1fr));
gap: 10px 12px;
margin: 0;
padding: 16px;
border: 1px solid rgba(15, 23, 42, .07);
border-radius: 24px;
background: rgba(255, 255, 255, .82);
box-shadow: 0 12px 32px rgba(15, 23, 42, .05);
}

.form-stay .form-section h2, .form-offer .form-section h2, .form-request .form-section h2 {
grid-column: 1 / -1;
display: flex;
align-items: center;
gap: 8px;
margin: 0 0 2px;
font-size: clamp(1rem, 1.5vw, 1.18rem);
letter-spacing: -.03em;
color: var(--navy);
}

.form-stay .form-section h2::before, .form-offer .form-section h2::before, .form-request .form-section h2::before {
content: '';
width: 10px;
height: 10px;
border-radius: 999px;
background: rgb(255 110 77);
box-shadow: 0 0 0 5px rgba(255, 110, 77, .12);
}

.form-stay .form-group, .form-offer .form-group, .form-request .form-group { margin-bottom: 0; }

.form-stay .form-group label, .form-offer .form-group label, .form-request .form-group label {
margin-bottom: 5px;
font-size: .82rem;
line-height: 1.15;
}

.form-stay input[type=text], .form-stay input[type=email], .form-stay input[type=password], .form-stay input[type=number], .form-stay input[type=date], .form-stay input[type=time], .form-stay select, .form-stay textarea, .form-offer input[type=text], .form-offer input[type=email], .form-offer input[type=password], .form-offer input[type=number], .form-offer input[type=date], .form-offer input[type=time], .form-offer select, .form-offer textarea, .form-request input[type=text], .form-request input[type=email], .form-request input[type=password], .form-request input[type=number], .form-request input[type=date], .form-request input[type=time], .form-request select, .form-request textarea {
min-height: 44px;
padding: 9px 12px;
border-radius: 14px;
font-size: .94rem;
}

.form-stay textarea, .form-offer textarea, .form-request textarea { min-height: 92px; }
 .form-stay .form-row, .form-offer .form-row, .form-request .form-row, .form-stay .availability-calendar-panel, .form-offer .availability-calendar-panel, .form-request .availability-calendar-panel, .form-stay .photo-plan-note, .form-offer .photo-plan-note, .form-request .photo-plan-note, .form-stay .form-actions, .form-offer .form-actions, .form-request .form-actions, .form-stay .form-group:has(textarea), .form-offer .form-group:has(textarea), .form-request .form-group:has(textarea), .form-stay .checkbox-group, .form-offer .checkbox-group, .form-request .checkbox-group, .form-stay .radio-group, .form-offer .radio-group, .form-request .radio-group {
 grid-column: 1 / -1;
}

.form-stay .form-help, .form-offer .form-help, .form-request .form-help {
margin-top: 5px;
font-size: .76rem;
}

.form-stay .form-actions, .form-offer .form-actions, .form-request .form-actions {
justify-content: flex-end;
margin-top: 4px;
padding-top: 4px;
}

.form-stay .availability-calendar-panel, .form-offer .availability-calendar-panel, .form-request .availability-calendar-panel {
padding: 14px;
border-radius: 22px;
}

@media (max-width: 980px) {

.listing-wizard.listing-wizard-modern { grid-template-columns: 1fr; }

.listing-wizard.listing-wizard-modern::before, .listing-wizard.listing-wizard-modern::after { display: none; }

.listing-wizard.listing-wizard-modern .listing-wizard-step, .listing-wizard.listing-wizard-modern .listing-wizard-step.is-active {
transform: none;
min-height: auto;
}
}

@media (max-width: 760px) {

.form-stay .form-section, .form-offer .form-section, .form-request .form-section {
grid-template-columns: 1fr;
padding: 13px;
border-radius: 20px;
}

.form-stay .form-actions, .form-offer .form-actions, .form-request .form-actions { justify-content: stretch; }

.form-stay .form-actions .btn, .form-offer .form-actions .btn, .form-request .form-actions .btn { flex: 1 1 100%; }
}

/* v19.1 keep active step emphasis as zoom only, without active border */
.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active { border-color: #ff79799e !important; }

@media (max-width: 980px) {

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active { transform: scale(1.025); }
}

@media (max-width: 560px) {

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active { transform: scale(1.015); }
}

/* v20 compact wizard form layout and calendar refinements */
.form-stay, .form-offer {
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: start;
}

.form-stay > .form-section, .form-offer > .form-section, .form-stay > .form-actions, .form-offer > .form-actions { grid-column: 1 / -1; }

.form-stay > .form-section-visibility, .form-stay > .form-section-service-settings, .form-offer > .form-section-pricing, .form-offer > .form-section-additional-info {
grid-column: auto;
height: 100%;
align-content: start;
}

.form-offer .form-group-title-full { grid-column: 1 / -1; }

.form-stay .form-fieldset, .form-offer .form-fieldset {
margin: 0;
border: 1px dashed #ccc;
border-radius: 15px;
}

.form-stay .form-radio, .form-offer .form-radio {
padding: 8px 10px;
border-radius: 14px;
}

.form-section-service-settings #custom_radius_group { grid-column: 1 / -1; }

.availability-calendar-panel {
padding: 12px;
border-radius: 20px;
}

.availability-calendar-head {
gap: 10px;
margin-bottom: 10px;
}

.availability-calendar-head strong { font-size: .92rem; }

.availability-calendar-head span {
margin-top: 2px;
font-size: .78rem;
line-height: 1.3;
}

.availability-calendar-btn {
width: 34px;
height: 34px;
border-radius: 12px;
font-size: 1.28rem;
}

.availability-calendar-selected {
gap: 6px;
margin-bottom: 10px;
}

.availability-calendar-selected span {
padding: 6px 9px;
font-size: .78rem;
}

.availability-calendar-grid { gap: 10px; }

.availability-month {
padding: 9px;
border-radius: 16px;
}

.availability-month-title {
margin-bottom: 8px;
font-size: .86rem;
}

.availability-weekdays, .availability-days { gap: 3px; }

.availability-weekdays span { font-size: .62rem; }

.availability-day {
min-height: 30px;
border-radius: 9px;
font-size: .82rem;
}

.availability-day.is-today:not(.is-start):not(.is-end) {
border-color: rgba(22, 184, 166, .82);
box-shadow: inset 0 0 0 1px rgba(22, 184, 166, .38), 0 5px 14px rgba(22, 184, 166, .10);
}

.availability-day.is-today.is-in-range:not(.is-start):not(.is-end) { border-color: rgba(15, 118, 110, .75); }

@media (max-width: 980px) {

.form-stay, .form-offer { grid-template-columns: 1fr; }

.form-stay > .form-section-visibility, .form-stay > .form-section-service-settings, .form-offer > .form-section-pricing, .form-offer > .form-section-additional-info { grid-column: 1 / -1; }
}

@media (max-width: 720px) {

.availability-calendar-panel { padding: 10px; }

.availability-day { min-height: 32px; }
}

/* v21 centered flash messages and responsive cleanup for recent UI changes */
.flash-container {
top: 50% !important;
left: 50% !important;
right: auto !important;
bottom: auto !important;
transform: translate(-50%, -50%) !important;
width: min(440px, calc(100vw - 32px));
max-height: calc(100vh - 32px);
overflow-y: auto;
justify-items: center;
align-content: center;
padding: 2px;
}

.flash-container .flash { width: 100%; }

/* Keep the compact add-listing layout consistent for stay, offer and request flows. */

.form-stay, .form-offer, .form-request { width: 100%; }

.form-request {
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: start;
}

.form-request > .form-section, .form-request > .form-actions { grid-column: 1 / -1; }
 .form-request .form-group-title-full, .form-request .availability-calendar-panel, .form-request .form-group:has(textarea), .form-request .checkbox-group, .form-request .radio-group, .form-request .form-row {
 grid-column: 1 / -1;
}

/* More compact 3-month calendar, while keeping readable tap targets. */
.availability-calendar-panel { max-width: 100%; }

.availability-calendar-grid { align-items: start; }

.availability-month { min-width: 0; }

.availability-day {
min-width: 0;
aspect-ratio: 1 / .86;
display: inline-grid;
place-items: center;
}

.availability-day.is-today:not(.is-start):not(.is-end) {
border-color: rgb(255 110 77);
box-shadow: inset 0 0 0 1px rgba(255, 110, 77, .42), 0 5px 14px rgba(255, 110, 77, .12);
}

/* Responsive audit overrides for the latest dashboard/wizard/cards/conversation changes. */
@media (max-width: 1180px) {

.availability-calendar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.listing-wizard.listing-wizard-modern { gap: 12px; }
}

@media (max-width: 980px) {

.form-stay, .form-offer, .form-request { grid-template-columns: 1fr; }

.form-stay > .form-section-visibility, .form-stay > .form-section-service-settings, .form-offer > .form-section-pricing, .form-offer > .form-section-additional-info, .form-request > .form-section { grid-column: 1 / -1; }

.listing-wizard.listing-wizard-modern {
padding: 8px;
border-radius: 24px;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step {
min-height: auto;
padding: 12px;
border-radius: 20px;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step.is-active {
transform: scale(1.025);
border-color: transparent !important;
}

.dashboard-stat-card::before {
right: 12px;
bottom: -10px;
font-size: clamp(3.8rem, 13vw, 6rem);
}
}

@media (max-width: 720px) {

.availability-calendar-grid {
grid-template-columns: 1fr;
gap: 8px;
}

.availability-calendar-panel {
padding: 10px;
border-radius: 18px;
}

.availability-calendar-head {
gap: 8px;
margin-bottom: 8px;
}

.availability-calendar-selected { margin-bottom: 8px; }

.availability-month {
padding: 8px;
border-radius: 14px;
}

.availability-day {
min-height: 32px;
aspect-ratio: auto;
}

.conversation-modern-wrap { padding-bottom: 230px; }

.conversation-compose, .conversation-compose.conversation-compose-modern {
width: calc(100vw - 18px);
max-height: min(52vh, 360px);
overflow-y: auto;
}
}

@media (max-width: 560px) {

.flash-container {
top: 50% !important;
left: 50% !important;
right: auto !important;
bottom: auto !important;
transform: translate(-50%, -50%) !important;
width: calc(100vw - 24px);
max-height: calc(100vh - 24px);
}

.flash {
grid-template-columns: auto minmax(0, 1fr) auto;
border-radius: 18px;
}

.listing-wizard.listing-wizard-modern {
margin: 8px 0 16px;
padding: 7px;
gap: 8px;
border-radius: 20px;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step {
gap: 10px;
padding: 10px;
border-radius: 18px;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step b, .listing-wizard.listing-wizard-modern .listing-wizard-step.is-active b {
width: 38px;
height: 38px;
border-radius: 14px;
}

.listing-wizard.listing-wizard-modern .listing-wizard-step small { max-width: none; }
 .form-container:has(.form-stay), .form-container:has(.form-offer), .form-container:has(.form-request) {
 padding: 12px;
 border-radius: 22px;
}

.form-stay .form-section, .form-offer .form-section, .form-request .form-section {
padding: 11px;
gap: 9px;
border-radius: 18px;
}

.form-stay input[type=text], .form-stay input[type=email], .form-stay input[type=password], .form-stay input[type=number], .form-stay input[type=date], .form-stay input[type=time], .form-stay select, .form-stay textarea, .form-offer input[type=text], .form-offer input[type=email], .form-offer input[type=password], .form-offer input[type=number], .form-offer input[type=date], .form-offer input[type=time], .form-offer select, .form-offer textarea, .form-request input[type=text], .form-request input[type=email], .form-request input[type=password], .form-request input[type=number], .form-request input[type=date], .form-request input[type=time], .form-request select, .form-request textarea {
min-height: 42px;
padding: 8px 10px;
border-radius: 13px;
font-size: .92rem;
}

.availability-calendar-head { flex-direction: column; }

.availability-calendar-nav {
width: 100%;
justify-content: space-between;
}

.availability-weekdays, .availability-days { gap: 2px; }

.availability-day {
min-height: 30px;
border-radius: 8px;
font-size: .78rem;
}

.dashboard-stats-grid { grid-template-columns: 1fr; }

.dashboard-stat-card::before {
font-size: 4.4rem;
right: 10px;
bottom: -8px;
}

.unified-listing-card .ll-card-user-panel, .unified-listing-card.ll-card-context-public .ll-card-user-panel, .unified-listing-card.ll-card-context-profile .ll-card-user-panel, .unified-listing-card.ll-card-context-owner .ll-card-user-panel {
max-width: 100%;
min-width: 0;
}

.conversation-compose.conversation-compose-modern {
padding: 12px;
border-radius: 18px 18px 0 0;
}
}

/* v22 add-listing refinements */
.flash-container {
top: 30% !important;
transform: translate(-50%, -30%) !important;
}

.form-offer > .form-section-photos {
grid-column: 1 / -1;
width: 100%;
}

.form-section-photos .offer-photo-fields {
display: grid;
grid-template-columns: 1fr;
gap: 12px;
}

.form-section-photos input[type=file] { width: 100%; }

.listing-wizard.listing-wizard-modern .listing-wizard-step:not(a) { cursor: default; }

@media (max-width: 720px) {

.form-section-photos .offer-photo-fields { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {

.flash-container {
top: 30% !important;
transform: translate(-50%, -30%) !important;
}
}

/* Unified services chooser and 4-step wizard flow */
.listing-wizard.listing-wizard-steps-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.service-kind-panel {
max-width: 980px;
margin: 1.5rem auto 3rem;
padding: clamp(1rem, 2vw, 1.5rem);
border-radius: 28px;
background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,247,242,.94));
box-shadow: 0 22px 60px rgba(15,23,42,.1);
}

.service-kind-head {
text-align: center;
max-width: 680px;
margin: 0 auto 1.2rem;
}

.service-kind-head h2 {
margin: .25rem 0 .35rem;
font-size: clamp(1.45rem, 2.5vw, 2.1rem);
}

.service-kind-head p {
margin: 0;
color: var(--text-muted, #64748b);
}

.service-kind-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
}

.service-kind-card {
display: grid;
gap: .6rem;
align-content: start;
min-height: 185px;
padding: 1.25rem;
border-radius: 24px;
text-decoration: none;
color: inherit;
background: rgba(255,255,255,.88);
border: 1px solid rgba(255,110,77,.16);
box-shadow: 0 12px 34px rgba(15,23,42,.08);
transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
justify-items: center;
}

.service-kind-card:hover {
transform: translateY(-4px);
box-shadow: 0 18px 44px rgba(255,110,77,.18);
background: #fff;
}

.service-kind-card > span {
width: 54px;
height: 54px;
display: inline-grid;
place-items: center;
border-radius: 18px;
background: rgba(255,110,77,.12);
}

.service-kind-card strong {
font-size: 1.08rem;
color: var(--text-main, #0f172a);
}

.service-kind-card small {
color: var(--text-muted, #64748b);
line-height: 1.45;
}

.service-kind-counter {
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
font-style: normal;
font-weight: 700;
font-size: .88rem;
line-height: 1.35;
padding: .5rem .7rem;
border-radius: 999px;
color: var(--text-main, #0f172a);
background: rgba(15,118,110,.1);
border: 1px solid rgba(15,118,110,.18);
}

.service-kind-counter.is-limit-reached {
color: #b91c1c;
background: rgba(239,68,68,.1);
border-color: rgba(239,68,68,.26);
}

@media (max-width: 980px) {

.listing-wizard.listing-wizard-steps-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {

.listing-wizard.listing-wizard-steps-4, .service-kind-grid { grid-template-columns: 1fr; }

.service-kind-panel {
margin-top: 1rem;
border-radius: 22px;
}

.service-kind-card { min-height: 0; }
}

.service-kind-card.offer {
border: 1px solid #0f766e;
background: #f5feff;
}

.service-kind-card.request {
border: 1px solid #c2410c;
background: #fff4f4;
}

/* Package quota counters */
.dashboard-quota-list {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 10px;
margin-top: 14px;
}

.dashboard-quota-item {
display: grid;
gap: 4px;
padding: 12px 14px;
border: 1px solid var(--line, #e2e8f0);
border-radius: 16px;
background: rgba(255,255,255,.72);
}

.dashboard-quota-item span {
font-size: .78rem;
font-weight: 800;
color: var(--muted, #64748b);
text-transform: uppercase;
letter-spacing: .04em;
}

.dashboard-quota-item strong {
color: var(--navy, #0e2a47);
font-size: 1.15rem;
font-weight: 950;
}

.dashboard-quota-item small {
color: var(--muted, #64748b);
font-weight: 700;
line-height: 1.35;
}

.dashboard-quota-item.is-limit-reached strong, .listing-quota-counter.is-limit-reached { color: #b91c1c; }

.listing-quota-counter { margin: 0 0 16px; }

/* Mobile dashboard shortcut and fixed bottom menu */
.btn-dashboard-mobile, .mobile-bottom-nav { display: none; }

.btn-nav-add-desktop {
display: inline-flex;
align-items: center;
gap: 8px;
}

@media (max-width: 640px) {

body.has-mobile-bottom-nav { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }

.nav-actions {
gap: 8px;
flex: 0 0 auto;
}

.nav-actions .nav-messages-link, .nav-actions .nav-dashboard-link, .nav-actions .btn-nav-add-desktop, .nav-actions .btn-add-stay-mobile { display: none !important; }

.btn-dashboard-mobile {
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: 7px;
min-height: 42px;
padding: 0 12px;
border-radius: 999px;
font-size: .86rem;
font-weight: 950;
white-space: nowrap;
color: var(--navy);
background: rgba(255,255,255,.92);
border: 1px solid rgba(14,42,71,.12);
box-shadow: 0 10px 28px rgba(14,42,71,.08);
}

.btn-dashboard-mobile .btn-icon {
width: 17px;
height: 17px;
color: var(--coral-2);
}

.mobile-bottom-nav {
position: fixed;
left: 12px;
right: 12px;
bottom: calc(10px + env(safe-area-inset-bottom));
z-index: 1200;
display: grid;
grid-template-columns: repeat(var(--mobile-bottom-nav-items, 4), minmax(0, 1fr));
gap: 6px;
padding: 8px;
border-radius: 26px;
background: rgba(255,255,255,.88);
border: 1px solid rgb(194 197 201 / 90%);
box-shadow: 0 20px 54px rgba(14,42,71,.18), 0 6px 18px rgba(14,42,71,.08);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
}

.mobile-bottom-nav-item {
position: relative;
min-width: 0;
min-height: 58px;
display: grid;
place-items: center;
align-content: center;
gap: 4px;
border-radius: 20px;
color: #64748b;
font-size: .68rem;
line-height: 1.05;
font-weight: 900;
text-align: center;
transition: transform .18s var(--ease), color .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease);
}

.mobile-bottom-nav-item:hover, .mobile-bottom-nav-item.active {
color: var(--navy);
background: linear-gradient(135deg, rgba(22,184,166,.14), rgba(255,122,89,.12));
box-shadow: inset 0 0 0 1px rgba(22,184,166,.16);
}

.mobile-bottom-nav-item:active { transform: translateY(1px) scale(.98); }

.mobile-bottom-nav-guest .mobile-bottom-nav-item:last-child {
color: var(--navy);
background: linear-gradient(135deg, rgba(255,122,89,.18), rgba(22,184,166,.12));
box-shadow: inset 0 0 0 1px rgba(255,122,89,.18);
}

.mobile-bottom-nav-icon, .mobile-bottom-nav-icon-wrap {
width: 22px;
height: 22px;
display: inline-grid;
place-items: center;
color: currentColor;
}

.mobile-bottom-nav-icon-wrap { position: relative; }

.mobile-bottom-nav-icon-wrap .mobile-bottom-nav-icon {
width: 22px;
height: 22px;
}

.mobile-bottom-nav-icon-wrap em {
position: absolute;
top: -8px;
right: -10px;
min-width: 17px;
height: 17px;
padding: 0 4px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
background: var(--coral);
color: #fff;
font-style: normal;
font-size: .62rem;
font-weight: 950;
box-shadow: 0 6px 14px rgba(255,122,89,.3);
}
}

@media (max-width: 380px) {

.btn-dashboard-mobile {
padding-inline: 10px;
font-size: .78rem;
}

.mobile-bottom-nav {
left: 8px;
right: 8px;
border-radius: 22px;
}

.mobile-bottom-nav-item {
min-height: 54px;
border-radius: 16px;
font-size: .62rem;
}
}

/* v8.7: explore results per-page control */
.explore-results-header {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 16px !important;
}

.explore-results-header h2 {
margin: 0 !important;
}

.explore-per-page-form {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
margin-left: auto !important;
white-space: nowrap !important;
}

.explore-per-page-form label {
font-size: .82rem !important;
font-weight: 850 !important;
color: var(--muted, #64748b) !important;
}

.explore-per-page-form select {
min-width: 86px !important;
height: 42px !important;
padding: 0 12px !important;
}

@media (max-width: 760px) {
.explore-results-header {
display: grid !important;
grid-template-columns: 1fr !important;
align-items: start !important;
}

.explore-per-page-form {
margin-left: 0 !important;
justify-content: flex-start !important;
}
}

/* v8.8: visually separate closest trip matches in explore */
.nearest-trip-matches {
position: relative !important;
margin: 24px 0 30px !important;
padding: 24px !important;
border: 1px solid rgba(22, 184, 166, .22) !important;
border-radius: 30px !important;
background: linear-gradient(135deg, rgba(22, 184, 166, .12), rgba(255, 122, 89, .08) 48%, rgba(255, 251, 244, .96)) !important;
box-shadow: 0 18px 55px rgba(14, 42, 71, .08) !important;
overflow: hidden !important;
}

.nearest-trip-matches:before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
pointer-events: none !important;
background: radial-gradient(circle at 8% 0%, rgba(22, 184, 166, .2), transparent 28%), radial-gradient(circle at 100% 0%, rgba(255, 122, 89, .16), transparent 24%) !important;
}

.nearest-trip-matches > * {
position: relative !important;
z-index: 1 !important;
}

.nearest-trip-matches .explore-section-heading {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
margin-bottom: 18px !important;
padding-bottom: 14px !important;
border-bottom: 1px solid rgba(14, 42, 71, .08) !important;
}

.nearest-trip-matches .explore-section-heading h3 {
margin: 0 !important;
font-size: clamp(1.15rem, 1vw + .95rem, 1.55rem) !important;
font-weight: 950 !important;
letter-spacing: -.02em !important;
color: var(--navy, #0E2A47) !important;
}

.nearest-trip-match-card {
box-shadow: 0 16px 42px rgba(14, 42, 71, .1) !important;
}

.explore-section-heading-secondary {
margin-top: 26px !important;
margin-bottom: 14px !important;
}

.explore-section-heading-secondary h3 {
margin: 0 !important;
font-size: 1.08rem !important;
font-weight: 900 !important;
color: var(--navy, #0E2A47) !important;
}

@media (max-width: 760px) {
.nearest-trip-matches {
margin: 18px 0 24px !important;
padding: 16px !important;
border-radius: 24px !important;
}

.nearest-trip-matches .explore-section-heading {
align-items: flex-start !important;
margin-bottom: 14px !important;
}
}

/* conversation full-page layout fix */
body.page-conversation,
body.no-mobile-bottom-nav.page-conversation {
    padding-bottom: 0 !important;
}

body.page-conversation .main-content {
    min-height: calc(100vh - 92px);
}

body.page-conversation .site-footer,
body.page-conversation .mobile-bottom-nav {
    display: none !important;
}

.conversation-page-modern {
    min-height: calc(100vh - 122px);
    display: flex;
    flex-direction: column;
    padding-bottom: 0 !important;
}

.conversation-page-modern .conversation-modern-card {
    min-height: calc(100vh - 150px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.conversation-page-modern .conversation-thread {
    flex: 1 1 auto;
    min-height: 320px;
    max-height: none;
    overflow-y: auto;
    padding-bottom: 24px;
}

.conversation-page-modern .conversation-compose.conversation-compose-modern {
    position: sticky;
    left: auto;
    bottom: 0;
    transform: none;
    width: 100%;
    max-height: none;
    overflow: visible;
    z-index: 10;
    margin-top: auto;
    border-radius: 22px 22px 0 0;
}

.location-other-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.location-other-fields [hidden] {
    display: none !important;
}

@media (max-width: 760px) {
    body.page-conversation .main-content {
        min-height: calc(100vh - 76px);
    }

    .conversation-page-modern {
        width: 100%;
        padding-left: 8px;
        padding-right: 8px;
        min-height: calc(100vh - 96px);
    }

    .conversation-page-modern .conversation-modern-card {
        min-height: calc(100vh - 104px);
        border-radius: 22px;
    }

    .conversation-page-modern .conversation-thread {
        min-height: 220px;
        padding-bottom: 16px;
    }

    .conversation-page-modern .conversation-compose.conversation-compose-modern {
        padding: 12px;
        border-radius: 18px 18px 0 0;
    }

    .conversation-page-modern .compose-input-row {
        grid-template-columns: 1fr;
    }

    .location-other-fields {
        grid-template-columns: 1fr;
    }
}
.footer-bottom a {
    display: inline;
}