/* Inner pages: the sections every page of the design shares, on Flatsome elements.
 * Sections carry class "dp dp-<name>"; rows with "dg" are laid out as CSS grids.
 * Page hero .dp-hero (photo + crumb + h1), page title .dp-ptitle (breeze band), intro .dp-intro,
 * photo/text pairs .dp-pair, call to action .dp-cta. Page-only parts live in assets/pages/<slug>.css. */

/* ---------- Flatsome wrappers back to the design's boxes ---------- */
.dp { padding: 0 !important; }
.dp > .section-content { width: 100%; }
.dp > .section-content > .row {
	max-width: var(--wrap);
	width: 100%;
	margin: 0 auto;
	padding: 0 24px;
}
.dp .row::before, .dp .row::after { content: none; display: none; }
.dp .row .row { width: auto; margin-left: 0; margin-right: 0; }
.dp .col { padding: 0; }
.dp .row.dg > .col { max-width: none; flex-basis: auto; width: auto; }
.dp .img, .dp .col-inner > .img:not(:last-child) { margin: 0; }
.dp .img-inner img { display: block; width: 100%; }
.dp .text p:empty { display: none; }
.dp ul li { margin-left: 0; }
.dp p.eyebrow { max-width: none; margin: 0 0 18px; }
.dp .button { margin: 0 16px 0 0; vertical-align: middle; }
.dp .button:last-child { margin-right: 0; }
.dp .text p:last-child { margin-bottom: 0; }
.dp-muted p:not(.eyebrow), .dp .muted { color: var(--muted); }

/* ---------- breadcrumb ---------- */
.dp .crumb {
	margin: 0 0 14px;
	font-size: 12px;
	line-height: 1.75;
	letter-spacing: .18em;
	text-transform: uppercase;
	font-weight: 500;
}

/* ---------- page hero: photo, dark fade, crumb + title at the bottom ---------- */
.dp-hero {
	height: min(600px, 46vw);
	min-height: 380px;
	align-items: flex-end;
	overflow: hidden;
}
.dp-hero > .section-bg img, .dp-hero > .section-bg .bg { width: 100%; height: 100%; object-fit: cover; }
.dp-hero > .section-bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(7, 50, 52, 0) 40%, rgba(7, 50, 52, .7));
}
.dp-hero > .section-content { position: relative; z-index: 2; padding-bottom: 56px; }
.dp-hero h1 { margin: 0; color: #fff; }
.dp-hero .crumb { color: rgba(255, 255, 255, .85); }
.dp-hero .crumb a { color: #fff; }
.dp-hero .crumb a:hover { color: #e6b47f; }

/* ---------- page title band (breeze) ---------- */
.dp-ptitle > .section-content { padding: 84px 0 70px; text-align: center; }
.dp-ptitle h1 { margin: 0 0 .5em; }
.dp-ptitle .crumb { color: var(--muted); }
.dp-ptitle .crumb a { color: var(--teal-d); }
.dp-ptitle .crumb a:hover { color: var(--gold-d); }
.dp-ptitle p:not(.crumb) { max-width: 700px; margin: 18px auto 0; color: var(--muted); font-size: 17px; }

/* ---------- intro: centred eyebrow, title, text ---------- */
.dp-intro > .section-content { padding: 120px 0 110px; text-align: center; }
.dp-intro h2, .dp-intro h1 { max-width: 820px; margin: 0 auto 24px; }
.dp-intro p:not(.eyebrow) { max-width: 760px; margin: 0 auto 1.1em; font-size: 17px; color: var(--muted); }
.dp-intro p:not(.eyebrow):last-child { margin-bottom: 0; }

/* facts row under an intro */
.dp .row.dp-facts {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	max-width: 920px;
	margin: 56px auto 0;
	padding: 0;
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}
.dp-facts > .col { flex: 1 1 0; max-width: none; min-width: 150px; padding: 22px 10px; border-left: 1px solid var(--line); }
.dp-facts > .col:first-child { border-left: 0; }
.dp-facts p { margin: 0 !important; }
.dp-facts .n { font-family: var(--serif); font-size: 34px; font-weight: 400; line-height: 1.1; color: var(--teal-d) !important; }
.dp-facts p:not(.n) {
	font-size: 11.5px !important;
	line-height: 28px;
	letter-spacing: .18em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--muted);
}

/* ---------- photo / text pairs (staggered, on mist) ---------- */
.dp-pairs { padding: 120px 0 !important; }
.dp > .section-content > .row.dp-pair { display: grid; grid-template-columns: repeat(12, 1fr); align-items: center; }
.dp > .section-content > .row.dp-pair + .row.dp-pair { margin-top: 110px; }
.dp-pair > .dp-pair-img { grid-column: 1 / 8; grid-row: 1; }
.dp-pair-img img { aspect-ratio: 7 / 5; object-fit: cover; }
.dp-pair > .dp-pair-txt { grid-column: 8 / 13; grid-row: 1; padding: 0 0 0 64px; }
.dp-pair-rev > .dp-pair-img { grid-column: 6 / 13; }
.dp-pair-rev > .dp-pair-txt { grid-column: 1 / 6; padding: 0 64px 0 0; }
.dp-pair-txt .text { margin-bottom: 30px; }
.dp-pair-txt p:not(.eyebrow) { color: var(--muted); }

/* ---------- call to action (night teal, breeze) ---------- */
.dp-cta { background-color: var(--night) !important; }
.dp-cta > .section-content { padding: 96px 0; text-align: center; }
.dp-cta h2 { max-width: 760px; margin: 0 auto 18px; color: #fff; }
.dp-cta p:not(.eyebrow) { max-width: 620px; margin: 0 auto 32px !important; color: rgba(255, 255, 255, .75); }
.dp-cta p.eyebrow { color: #e6b47f; }
.dp-cta .col-inner { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.dp-cta .col-inner > .text { flex: 0 0 100%; }
.dp-cta .button { margin: 0; }

/* ---------- section heading (centred eyebrow + h2) ---------- */
.dp-sec-h { text-align: center; margin-bottom: 56px; }
.dp-sec-h h2 { max-width: 760px; margin: 0 auto; }

/* ---------- photo cards, 3 a row (.dp-cards) ---------- */
.dp-cards-sec > .section-content { padding: 0 0 120px; }
.dp > .section-content > .row.dp-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 64px 32px;
}
.dp-card .dp-card-img { margin-bottom: 26px !important; overflow: hidden; }
.dp-card .dp-card-img img { aspect-ratio: 4 / 3; object-fit: cover; transition: transform .6s ease; }
.dp-card .dp-card-img:hover img { transform: scale(1.04); }
.dp-card p.eyebrow { margin-bottom: 12px; }
.dp-card h3 { margin: 0 0 12px; font-size: 26px; line-height: 1.25; }
.dp-card h3 a { color: var(--ink); }
.dp-card h3 a:hover { color: var(--teal-d); }
.dp-card p:not(.eyebrow) { margin-bottom: 20px !important; color: var(--muted); }

/* ---------- numbered text features, 3 a row (.dp-feats) ---------- */
.dp-feats-sec > .section-content { padding: 110px 0 120px; }
.dp > .section-content > .row.dp-feats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}
.dp-feat > .col-inner { height: 100%; padding: 40px 36px 38px; background: #fff; border: 1px solid var(--line); }
.dp-feat .n { margin: 0 0 18px !important; font-family: var(--serif); font-size: 40px; line-height: 1; color: var(--gold); }
.dp-feat h3 { margin: 0 0 12px; font-size: 24px; }
.dp-feat p:not(.n) { color: var(--muted); }

/* ---------- photo gallery (ux_gallery, 3 a row, lightbox) ---------- */
.dp-gallery > .section-content { padding: 110px 0 120px; }
.dp-gallery .gallery-col .box-image { overflow: hidden; }
.dp-gallery .gallery-col img { object-fit: cover; }
.dp-gallery .gallery-box .box-text { display: none; }

/* ---------- night info card (address, links) ---------- */
.dp-info-card { padding: 42px 40px; background: var(--night) var(--breeze-dark); color: rgba(255, 255, 255, .85); }
.dp-info-card h3 { margin: 0; color: #fff; }
.dp-info-card dl { margin: 22px 0 0; }
.dp-info-card dt {
	margin-top: 20px;
	font-size: 11px;
	line-height: 1.75;
	letter-spacing: .2em;
	text-transform: uppercase;
	font-weight: 500;
	color: #e6b47f;
}
.dp-info-card dd { margin: 4px 0 0; font-size: 15px; color: rgba(255, 255, 255, .85); }
.dp-info-card dd a { color: #fff; }
.dp-info-card dd a:hover { color: #e6b47f; }
.dp-info-card .link-arrow { margin-top: 8px; font-size: 11px; color: #fff; }

@media (max-width: 1024px) {
	.dp > .section-content > .row.dp-cards { grid-template-columns: 1fr 1fr; gap: 50px 24px; }
	.dp > .section-content > .row.dp-feats { gap: 20px; }
	.dp-feat > .col-inner { padding: 32px 26px; }
	.dp-cards-sec > .section-content { padding-bottom: 90px; }
	.dp-feats-sec > .section-content,
	.dp-gallery > .section-content { padding: 80px 0 90px; }
}

@media (max-width: 767px) {
	.dp > .section-content > .row.dp-cards,
	.dp > .section-content > .row.dp-feats { grid-template-columns: 1fr; gap: 44px; }
	.dp > .section-content > .row.dp-feats { gap: 16px; }
	.dp-cards-sec > .section-content { padding-bottom: 72px; }
	.dp-feats-sec > .section-content,
	.dp-gallery > .section-content { padding: 70px 0 72px; }
	.dp-sec-h { margin-bottom: 36px; }
	.dp-card h3 { font-size: 24px; }
	.dp-info-card { padding: 34px 26px; }
}

@media (max-width: 1024px) {
	.dp-pairs { padding: 80px 0 !important; }
	.dp > .section-content > .row.dp-pair { display: block; }
	.dp-pair > .dp-pair-txt, .dp-pair-rev > .dp-pair-txt { padding: 36px 0 0; }
}

@media (max-width: 767px) {
	.dp > .section-content > .row { padding: 0 20px; }
	.dp-hero { height: 420px; min-height: 0; }
	.dp-hero > .section-content { padding-bottom: 36px; }
	.dp-ptitle > .section-content { padding: 56px 0 44px; }
	.dp-intro > .section-content { padding: 76px 0 70px; }
	.dp-intro p:not(.eyebrow) { font-size: 16px; }
	.dp-facts > .col { flex: 1 1 50%; border-left: 0; border-top: 1px solid var(--line); }
	.dp-facts > .col:nth-child(-n+2) { border-top: 0; }
	.dp-facts > .col:nth-child(even) { border-left: 1px solid var(--line); }
	.dp-facts .n { font-size: 28px; }
	.dp > .section-content > .row.dp-pair + .row.dp-pair { margin-top: 70px; }
	.dp-cta > .section-content { padding: 72px 0; }
}
