:root {
	--primary: #124463; /* Deep Zurich blue */
	--primary-700: #0f3a53;
	--accent: #1fb6ff; /* Light accent for highlights */
	--bg: #f4f7fb;
	--card: #ffffff;
	--text: #1f2937;
	--muted: #6b7280;
	--ring: rgba(18, 68, 99, 0.14);
	--radius: 18px;
	--shadow: 0 10px 30px rgba(18, 68, 99, 0.1);
}

a {
	color: var(--primary);
	text-decoration: none;
}

.container {
	width: min(1300px, 92%);
	margin-inline: auto;
}
.grid {
	display: grid;
	gap: 22px;
}
.grid-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1000px) {
	.grid-4 {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 760px) {
	.grid-3,
	.grid-2,
	.grid-4 {
		grid-template-columns: 1fr;
	}
}

.end-of-tenancybtn{
    display: inline-flex !important;
	align-items: center !important;
	gap: 0.6rem !important;
	padding: 0.9rem 1.2rem !important;
	background: var(--primary) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 14px !important;
	cursor: pointer !important;
	font-weight: 600 !important;
	box-shadow: var(--shadow) !important;
	transition: transform 0.15s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}
.end-of-tenancybtn:hover {
	transform: translateY(-1px) !important;
	background: var(--primary-700) !important;
} 
.btn.outline {
	background: #fff;
	color: var(--primary);
	border: 2px solid var(--primary);
}
.btn.chip {
	padding: 0.5rem 0.8rem;
	background: #e8f4ff;
	color: #0b5a88;
	box-shadow: none;
}

.hero-like-section {
	position: relative;
	overflow: hidden;
	background: radial-gradient(
			1200px 600px at 100% -20%,
			rgba(31, 182, 255, 0.25),
			transparent 60%
		),
		radial-gradient(
			800px 600px at -10% 0%,
			rgba(18, 68, 99, 0.2),
			transparent 60%
		),
		linear-gradient(180deg, #0e2f45 0%, #124463 100%);
	color: #fff;
}
.hero-inner {
	padding: 84px 0 56px;
	text-align: center;
}
.breadcrumb {
	display: flex;
	gap: 0.6rem;
	align-items: center;
	color: #cfe6ff;
	font-size: 0.92rem;
	opacity: 0.95;
	justify-content: center;
}
.breadcrumb a {
	color: #cfe6ff;
	text-decoration: underline dotted;
}
.hero-like-section h1 {
	margin: 0.6rem 0 1rem;
	font-size: clamp(1.8rem, 3.2vw + 1rem, 3rem);
	line-height: 1.1;
	letter-spacing: 0.2px;
}
.hero-like-section p.lead {
	font-size: clamp(1rem, 0.7vw + 0.8rem, 1.15rem);
	color: #e8f3ff;
	max-width: 940px;
	margin: 0 auto 1.3rem;
}
.hero-cta {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 14px;
	justify-content: center;
}

section {
	padding: 54px 0;
}
.card {
	background: var(--card);
	border: 1px solid #e7edf6;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	overflow: hidden;
}
.card.pad {
	padding: 22px;
}
.sec-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 18px;
}
.sec-head h2 {
	margin: 0;
	font-size: clamp(1.3rem, 0.8vw + 1.1rem, 2rem);
	color: #0b3752;
}
.muted {
	color: var(--muted);
}

.list {
	display: grid;
	gap: 10px;
	padding-left: 0;
	margin: 0;
	list-style: none;
}
.li {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	background: #fff;
	border: 1px dashed #dbe7f4;
	border-radius: 12px;
	padding: 0.75rem 0.9rem;
}
.li .tick {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: #e9f7f1;
	color: #0f7a54;
	font-weight: 800;
	font-size: 0.85rem;
	flex: 0 0 22px;
}

.city {
	display: flex;
	flex-direction: column;
	/* height: 100%; */
}
.city .thumb {
	height: 110px;
	background: linear-gradient(
		180deg,
		rgba(18, 68, 99, 0.05),
		rgba(18, 68, 99, 0)
	);
	display: grid;
	place-items: center;
	overflow: hidden;
}
.badge {
	display: inline-block;
	background: #eef7ff;
	color: #0b5a88;
	padding: 0.25rem 0.6rem;
	border-radius: 999px;
	font-size: 0.82rem;
	border: 1px solid #cfe8ff;
}

.check-columns {
	display: grid;
	gap: 22px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 760px) {
	.check-columns {
		grid-template-columns: 1fr;
	}
}

.price {
	display: flex;
	align-items: baseline;
	gap: 0.35rem;
}
.price .amt {
	font-size: 1.8rem;
	font-weight: 800;
	color: #0b3752;
}
.pill {
	display: inline-block;
	padding: 0.22rem 0.55rem;
	font-size: 0.78rem;
	border-radius: 999px;
	background: #f0f7ff;
	color: #0b3752;
	border: 1px solid #d9e9fb;
}

details {
	background: #fff;
	border: 1px solid #e7edf6;
	border-radius: 14px;
	margin-bottom: 12px;
	box-shadow: var(--shadow);
	overflow: hidden;
}
summary {
	cursor: pointer;
	list-style: none;
	padding: 16px 18px;
	font-weight: 700;
	color: #0b3752;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
summary::-webkit-details-marker {
	display: none;
}
details[open] summary {
	border-bottom: 1px dashed #e7edf6;
}
.faq-body {
	padding: 14px 18px 18px;
	color: #334155;
}

.cta {
	background: linear-gradient(90deg, #0f3a53, #124463 55%, #15608b);
	color: #fff;
	border-radius: var(--radius);
	padding: 22px;
	display: flex;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}
.mini {
	font-size: 0.9rem;
	color: #547089;
}
.to-top {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 50;
	background: #fff;
	border: 1px solid #dce9f7;
	border-radius: 999px;
	box-shadow: var(--shadow);
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 0.85rem;
	color: #0b3752;
}

/* Forms */
form {
	display: grid;
	gap: 12px;
}
input,
textarea,
select {
	padding: 12px 14px;
	border: 1px solid #d7e3f0;
	border-radius: 10px;
	width: 100%;
	background: #fff;
}
textarea {
	resize: vertical;
}
label {
	font-weight: 600;
	color: #0b3752;
}
.pad p{
    font-size: 15px;
}
.pad{
    padding: 10px;

}