/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://donebyfriday.com.au
 Description:  Done By Friday starter child theme for GeneratePress + GenerateBlocks
 Author:       Done By Friday
 Author URI:   https://donebyfriday.com.au
 Template:     generatepress
 Version:      1.3.0
 Text Domain:  generatepress-child
*/

/* ==========================================================================
   DBF BASE STYLES
   Rule: colours & fonts live in GP Customizer (Global Colors / Typography).
   This file only handles what the Customizer and GenerateBlocks do poorly.
   Colours below use GP's global colour variables, so each client site
   picks up its own brand automatically. No hex codes to change per site.
   ========================================================================== */

/* ---------- 1. Site-wide tweaks you can adjust per site ------------------ */
:root {
	--dbf-radius: 8px;
	--dbf-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
	--dbf-shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.12);
	--dbf-transition: 0.2s ease;
}

/* ---------- 2. Foundations -------------------------------------------- */
html {
	scroll-behavior: smooth;
}

img {
	border-radius: var(--dbf-radius);
}

/* Logo shouldn't get rounded corners */
.site-logo img,
.custom-logo {
	border-radius: 0;
}

a {
	text-underline-offset: 3px;
	transition: color var(--dbf-transition);
}

/* Clear keyboard focus (accessibility and good practice) */
:focus-visible {
	outline: 2px solid var(--accent, #1e73be);
	outline-offset: 3px;
}

/* ---------- 3. Buttons (hover feel GB doesn't give by default) -------- */
.gb-button,
.button,
button,
input[type="submit"] {
	transition: transform var(--dbf-transition), box-shadow var(--dbf-transition),
		background-color var(--dbf-transition);
}

.gb-button:hover,
.button:hover,
input[type="submit"]:hover {
	transform: translateY(-2px);
	box-shadow: var(--dbf-shadow-hover);
}

/* ---------- 4. Forms: the money page (every lead comes through one) ------ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
select,
textarea {
	width: 100%;
	padding: 14px 16px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: var(--dbf-radius);
	background: var(--base-3, #fff);
	font-size: 16px; /* 16px stops iPhones zooming in on tap */
	transition: border-color var(--dbf-transition), box-shadow var(--dbf-transition);
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--accent, #1e73be);
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
	outline: none;
}

input[type="submit"],
button[type="submit"] {
	width: 100%;
	padding: 16px 24px;
	border-radius: var(--dbf-radius);
	font-weight: 600;
	cursor: pointer;
}

label {
	display: block;
	margin-bottom: 6px;
	font-weight: 600;
}

/* ---------- 5. Utility classes: add in GB under Advanced > Additional CSS class -- */

/* Card look: listings, services, testimonials */
.dbf-card {
	background: var(--base-3, #fff);
	border-radius: var(--dbf-radius);
	box-shadow: var(--dbf-shadow);
	overflow: hidden;
	transition: transform var(--dbf-transition), box-shadow var(--dbf-transition);
}

.dbf-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--dbf-shadow-hover);
}

/* Soft shadow only */
.dbf-shadow {
	box-shadow: var(--dbf-shadow);
}

/* Keep long text readable */
.dbf-narrow {
	max-width: 65ch;
	margin-left: auto;
	margin-right: auto;
}

/* Hide on mobile / desktop */
@media (max-width: 767px) {
	.dbf-hide-mobile { display: none !important; }
}
@media (min-width: 768px) {
	.dbf-hide-desktop { display: none !important; }
}

/* ---------- 6. Mobile call bar: the lead generator ---------------------
   Build a GB Container with class "dbf-callbar" holding two buttons
   (Call / Enquire). Put it in a GP Element (Hook: wp_footer).
   It only shows on phones.
   ------------------------------------------------------------------------ */
.dbf-callbar {
	display: none;
}

@media (max-width: 767px) {
	.dbf-callbar {
		display: flex;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		gap: 8px;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: var(--base-3, #fff);
		box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1);
	}

	.dbf-callbar > * {
		flex: 1;
		text-align: center;
	}

	/* Stop the bar covering the footer (only when the bar exists) */
	body:has(.dbf-callbar) {
		padding-bottom: 76px;
	}
}

/* ---------- 7. Respect people who turn off motion ---------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
		animation: none !important;
		scroll-behavior: auto !important;
	}
}

/* ==========================================================================
   8. EASY PROPERTY LISTINGS (only used when EPL is active)
   Colours come from GP Global Colors by default. To brand a site, set the
   --dbf-* variables in that site's Customize > Additional CSS.
   ========================================================================== */
:root {
	--dbf-ink: var(--contrast, #1b1f2a);
	--dbf-muted: var(--contrast-2, #5b6270);
	--dbf-line: var(--contrast-3, #dfe2e8);
	--dbf-bg: var(--base-3, #ffffff);
	--dbf-surface: var(--base-2, #f5f6f8);
	--dbf-cta: var(--accent, #1e73be);
	--dbf-cta-ink: var(--base-3, #ffffff);
	--dbf-brand: var(--contrast, #1b1f2a);
	--dbf-brand-ink: var(--base-3, #ffffff);
	--dbf-heading-font: inherit;
}

/* Buttons */
.dbf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 12px 22px;
	border: 2px solid var(--dbf-cta);
	border-radius: var(--dbf-radius);
	background: var(--dbf-cta);
	color: var(--dbf-cta-ink);
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: transform var(--dbf-transition), box-shadow var(--dbf-transition), background-color var(--dbf-transition);
}
.dbf-btn:hover,
.dbf-btn:focus-visible {
	background: var(--dbf-brand);
	border-color: var(--dbf-brand);
	color: var(--dbf-brand-ink);
	transform: translateY(-1px);
	box-shadow: var(--dbf-shadow-hover);
}
.dbf-btn--ghost {
	background: transparent;
	border-color: var(--dbf-line);
	color: var(--dbf-ink);
}
.dbf-btn--ghost:hover,
.dbf-btn--ghost:focus-visible {
	background: transparent;
	color: var(--dbf-ink);
	border-color: var(--dbf-ink);
}
.dbf-btn--block {
	width: 100%;
}
.dbf-btn .dbf-icon {
	flex: none;
}

.dbf-eyebrow {
	margin: 0 0 8px;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--dbf-cta);
}
.dbf-muted {
	color: var(--dbf-muted);
}

/* ---------- Single listing ---------- */
.dbf-listing {
	background: var(--dbf-bg);
	color: var(--dbf-ink);
	padding-bottom: 48px;
}
.dbf-listing h1,
.dbf-listing h2,
.dbf-listing h3,
.dbf-listing h5 {
	color: var(--dbf-ink);
	font-family: var(--dbf-heading-font);
}

/* Gallery */
.dbf-gallery {
	position: relative;
	background: var(--dbf-surface);
}
.dbf-gallery__track {
	display: flex;
	height: clamp(260px, 58vw, 620px);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
.dbf-gallery__track::-webkit-scrollbar {
	display: none;
}
.dbf-gallery__slide {
	flex: 0 0 100%;
	margin: 0;
	scroll-snap-align: start;
}
.dbf-gallery__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}
.dbf-gallery__badge {
	position: absolute;
	top: 16px;
	left: 16px;
	padding: 6px 12px;
	border-radius: 4px;
	background: var(--dbf-cta);
	color: var(--dbf-cta-ink);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.dbf-gallery__count {
	position: absolute;
	right: 16px;
	bottom: 16px;
	padding: 4px 12px;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.65);
	color: #fff;
	font-size: 0.85rem;
}
.dbf-gallery__nav {
	position: absolute;
	top: 50%;
	display: none;
	width: 48px;
	height: 48px;
	padding: 0;
	margin-top: -24px;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: #111;
	box-shadow: var(--dbf-shadow);
}
.dbf-gallery__nav:hover {
	background: #fff;
	color: #111;
	transform: none;
}
.dbf-gallery__nav--prev { left: 16px; }
.dbf-gallery__nav--next { right: 16px; }
@media (min-width: 768px) {
	.dbf-gallery__nav { display: inline-flex; }
}

/* Listing pages manage their own spacing: drop GeneratePress's container
   padding so the gallery runs edge to edge and the form gets the full width. */
.dbf-single-listing .site-content,
.dbf-single-listing .inside-article {
	padding: 0;
}

/* Two-column layout: content + sticky enquiry card */
.dbf-listing__grid {
	display: grid;
	gap: 8px;
	padding: 24px 16px 0;
}
@media (min-width: 600px) {
	.dbf-listing__grid { padding: 28px 24px 0; }
}
@media (min-width: 1000px) {
	.dbf-listing__grid {
		grid-template-columns: minmax(0, 1fr) 380px;
		gap: 56px;
		padding: 40px 40px 0;
		align-items: start;
	}
	.dbf-listing__side {
		position: sticky;
		top: 24px;
	}
	.admin-bar .dbf-listing__side { top: 56px; }
	.dbf-listing__ctas { display: none !important; }
}

.dbf-listing__title {
	margin: 0 0 12px;
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	line-height: 1.15;
}
.dbf-listing__place {
	display: block;
	margin-top: 4px;
	font-size: 0.55em;
	font-weight: 400;
	color: var(--dbf-muted);
}
.dbf-listing__price,
.dbf-listing-card__price {
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--dbf-ink);
}
.dbf-listing__price .rent-text,
.dbf-listing__price .page-price-rent span:not(.page-price) {
	font-weight: 400;
	color: var(--dbf-muted);
}

/* Key facts */
.dbf-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 22px;
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}
.dbf-facts li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	color: var(--dbf-ink);
}
.dbf-facts .dbf-icon {
	color: var(--dbf-muted);
}
.dbf-facts--compact {
	gap: 8px 16px;
	margin-top: 12px;
	font-size: 0.95rem;
}

.dbf-listing__ctas {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-top: 22px;
}
.dbf-listing__ctas .dbf-btn {
	padding-left: 10px;
	padding-right: 10px;
}

/* Content sections */
.dbf-section {
	padding: 30px 0;
	border-top: 1px solid var(--dbf-line);
}
.dbf-listing__header + .dbf-section {
	margin-top: 28px;
}
.dbf-section__title,
.dbf-features .epl-tab-title {
	margin: 0 0 16px;
	font-size: 1.3rem;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: 0;
}
.dbf-description p:last-child {
	margin-bottom: 0;
}

/* Inspection times (EPL markup) */
.dbf-inspections .home-open > strong,
.dbf-inspections .epl-inspection-times > strong,
.dbf-inspections .home-open-label,
.dbf-inspections .epl-inspection-times-label {
	display: none;
}
.dbf-inspections ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.dbf-inspections li {
	margin: 0;
}
.dbf-inspections li a,
.dbf-inspections li {
	color: var(--dbf-ink);
}
.dbf-inspections li a {
	display: inline-block;
	padding: 10px 14px;
	border: 1px solid var(--dbf-line);
	border-radius: var(--dbf-radius);
	background: var(--dbf-surface);
	text-decoration: none;
	font-weight: 600;
}
.dbf-inspections__private {
	margin: 16px 0 0;
}
.dbf-inspections__private a {
	font-weight: 600;
	color: var(--dbf-ink);
}

/* Features (EPL markup) */
.dbf-features ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 10px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.dbf-features li {
	position: relative;
	margin: 0;
	padding-left: 24px;
	float: none;
	width: auto;
}
.dbf-features li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 0.45em;
	width: 10px;
	height: 6px;
	border-left: 2px solid var(--dbf-cta);
	border-bottom: 2px solid var(--dbf-cta);
	transform: rotate(-45deg);
}
.dbf-features:empty {
	display: none;
}
/* Beds, baths and cars are already in the key facts row */
.dbf-features li.bedrooms,
.dbf-features li.bathrooms,
.dbf-features li.parking,
.dbf-features li.garage,
.dbf-features li.carport {
	display: none;
}

/* Lease details */
.dbf-keyinfo dl {
	margin: 0;
}
.dbf-keyinfo dl > div {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid var(--dbf-line);
}
.dbf-keyinfo dt {
	color: var(--dbf-muted);
	font-weight: 400;
}
.dbf-keyinfo dd {
	margin: 0;
	font-weight: 600;
	text-align: right;
}

/* Map */
.dbf-map__frame {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--dbf-radius);
	background: var(--dbf-surface);
}
@media (min-width: 768px) {
	.dbf-map__frame { aspect-ratio: 16 / 9; }
}
.dbf-map__frame iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

/* Share: present but quiet */
.dbf-share {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	padding-top: 20px;
	border-top: 1px solid var(--dbf-line);
	font-size: 0.9rem;
	color: var(--dbf-muted);
}
.dbf-share a {
	color: var(--dbf-muted);
}

/* Enquiry card */
.dbf-enquiry-card {
	padding: 24px;
	border: 1px solid var(--dbf-line);
	border-radius: calc(var(--dbf-radius) + 4px);
	background: var(--dbf-bg);
	color: var(--dbf-ink);
	box-shadow: var(--dbf-shadow);
}
@media (max-width: 999px) {
	.dbf-listing__side { margin-top: 12px; scroll-margin-top: 16px; }
}
@media (max-width: 599px) {
	.dbf-enquiry-card { padding: 20px 16px; }
}
.dbf-enquiry-card__title {
	margin: 20px 0 6px;
	font-size: 1.25rem;
	line-height: 1.3;
	color: var(--dbf-ink);
}
.dbf-enquiry-card__intro {
	margin: 0 0 16px;
	font-size: 0.95rem;
	color: var(--dbf-muted);
}
.dbf-enquiry-card--inline {
	max-width: 560px;
}

.dbf-agent {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--dbf-line);
}
.dbf-agent p {
	margin: 0;
}
.dbf-agent__photo {
	flex: none;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	object-fit: cover;
	object-position: 50% 15%; /* keep the face in frame on portrait photos */
	background: var(--dbf-surface);
}
.dbf-agent__photo--initials {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--dbf-brand);
	color: var(--dbf-brand-ink);
	font-weight: 700;
	font-size: 1.1rem;
}
.dbf-agent__name {
	font-weight: 700;
	font-size: 1.05rem;
}
.dbf-agent__role {
	font-size: 0.9rem;
	color: var(--dbf-muted);
}
.dbf-agent__phone {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-weight: 700;
	color: var(--dbf-ink);
	text-decoration: none;
}
.dbf-agent__phone .dbf-icon {
	width: 16px;
	height: 16px;
	color: var(--dbf-cta);
}

/* Form */
.dbf-form .dbf-field {
	margin: 0 0 12px;
}
.dbf-form label {
	margin-bottom: 4px;
	font-size: 0.9rem;
	color: var(--dbf-ink);
}
.dbf-form input:not([type="radio"]),
.dbf-form textarea {
	border-color: var(--dbf-line);
	background: var(--dbf-bg);
	color: var(--dbf-ink);
}
.dbf-form input:focus,
.dbf-form textarea:focus {
	border-color: var(--dbf-cta);
}
.dbf-optional {
	font-weight: 400;
	color: var(--dbf-muted);
}
.dbf-intents {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
}
.dbf-intent {
	position: relative;
	display: inline-block;
	margin: 0 !important;
	font-weight: 600;
	cursor: pointer;
}
.dbf-intent input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}
.dbf-intent span {
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid var(--dbf-line);
	border-radius: 999px;
	font-size: 0.88rem;
	line-height: 1.2;
	transition: background-color var(--dbf-transition), border-color var(--dbf-transition);
}
.dbf-intent input:checked + span {
	border-color: var(--dbf-cta);
	background: var(--dbf-cta);
	color: var(--dbf-cta-ink);
}
.dbf-intent input:focus-visible + span {
	outline: 2px solid var(--dbf-cta);
	outline-offset: 2px;
}
.dbf-form .dbf-btn {
	margin-top: 4px;
	font-size: 1rem;
}
.dbf-form__note {
	margin: 12px 0 0;
	font-size: 0.8rem;
	color: var(--dbf-muted);
}
.dbf-form__note a {
	color: var(--dbf-muted);
}
.dbf-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.dbf-form-error {
	padding: 10px 14px;
	border-radius: var(--dbf-radius);
	background: #fdecea;
	color: #8a1c12;
	font-size: 0.9rem;
}
.dbf-form-success {
	padding: 22px;
	border-radius: var(--dbf-radius);
	background: var(--dbf-surface);
	text-align: center;
	outline: none;
}
.dbf-form-success .dbf-icon {
	width: 36px;
	height: 36px;
	color: var(--dbf-cta);
}
.dbf-form-success__title {
	margin: 8px 0 6px;
	font-weight: 700;
	font-size: 1.1rem;
}
.dbf-form-success p:last-child {
	margin: 0;
}

/* Appraisal band: turns buyers and renters into vendor and landlord leads */
.dbf-appraisal {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 20px;
	margin: 40px 16px 0;
	padding: 28px 22px;
	border-radius: calc(var(--dbf-radius) + 4px);
	background: var(--dbf-brand);
	color: var(--dbf-brand-ink);
}
.dbf-appraisal h2 {
	margin: 0 0 8px;
	font-size: clamp(1.3rem, 3vw, 1.7rem);
	line-height: 1.25;
	color: var(--dbf-brand-ink);
	font-family: var(--dbf-heading-font);
}
.dbf-appraisal p {
	margin: 0;
	max-width: 56ch;
	opacity: 0.9;
}
.dbf-appraisal .dbf-eyebrow {
	opacity: 1;
}
@media (min-width: 768px) {
	.dbf-appraisal {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		margin: 48px 24px 0;
		padding: 40px 44px;
	}
	.dbf-appraisal .dbf-btn { flex: none; }
}
@media (min-width: 1000px) {
	.dbf-appraisal { margin: 48px 40px 0; }
}

/* Mobile call bar buttons */
.dbf-callbar {
	background: var(--dbf-bg);
}
.dbf-callbar .dbf-btn {
	min-height: 50px;
	padding: 10px 12px;
	font-size: 0.95rem;
	white-space: nowrap;
}
/* On phones the fixed call bar replaces the header buttons */
@media (max-width: 767px) {
	.dbf-listing__ctas { display: none; }
}
.dbf-inspections li a {
	font-size: 0.95rem;
}
.dbf-callbar .dbf-btn--ghost {
	background: var(--dbf-bg);
}
.dbf-callbar .dbf-btn--ghost:hover,
.dbf-callbar .dbf-btn--ghost:focus-visible {
	background: var(--dbf-bg);
}
/* On the dark appraisal band, hover goes light so the button stays visible */
.dbf-appraisal .dbf-btn:hover,
.dbf-appraisal .dbf-btn:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--dbf-brand);
}

/* ---------- Listing archive cards ---------- */
.dbf-archive {
	padding: 32px 20px;
	background: var(--dbf-bg);
	color: var(--dbf-ink);
}
@media (min-width: 768px) {
	.dbf-archive { padding: 40px; }
}
.dbf-archive__title {
	margin-bottom: 24px;
	color: var(--dbf-ink);
	font-family: var(--dbf-heading-font);
}
.dbf-archive__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}
.dbf-listing-card {
	border: 1px solid var(--dbf-line);
	background: var(--dbf-bg);
}
.dbf-listing-card__link {
	display: block;
	height: 100%;
	color: var(--dbf-ink);
	text-decoration: none;
}
.dbf-listing-card__link:hover {
	color: var(--dbf-ink);
}
.dbf-listing-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--dbf-surface);
}
.dbf-listing-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}
.dbf-listing-card__body {
	padding: 18px 20px 22px;
}
.dbf-listing-card__title {
	margin: 6px 0 0;
	font-size: 1.1rem;
	line-height: 1.3;
	color: var(--dbf-ink);
}
.dbf-listing-card__title span {
	display: block;
	font-size: 0.9rem;
	font-weight: 400;
	color: var(--dbf-muted);
}

/* Listing grids from the [listing class="dbf-listing-grid"] shortcode */
.dbf-listing-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 32px;
}
.dbf-listing-grid--2 {
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr));
}
.dbf-listing-grid::before,
.dbf-listing-grid::after {
	display: none;
}
.dbf-listing-grid .dbf-listing-card {
	margin: 0;
}

/* Email list sign-up [dbf_subscribe]: built for dark or image backgrounds */
.dbf-subscribe {
	width: 100%;
}
.dbf-subscribe__fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
}
.dbf-subscribe__field {
	margin: 0;
}
.dbf-subscribe__field input {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: var(--dbf-radius);
	background: #fff;
	color: var(--dbf-ink);
	font-size: 1rem;
}
.dbf-subscribe__field input:focus {
	outline: 2px solid var(--dbf-cta);
	outline-offset: 1px;
	border-color: var(--dbf-cta);
}
.dbf-subscribe__btn {
	grid-column: 1 / -1;
	width: 100%;
	white-space: nowrap;
}
.dbf-subscribe__note {
	margin: 10px 0 0;
	font-size: 0.8rem;
	color: rgba(255, 255, 255, 0.8);
}
.dbf-subscribe__note a {
	color: inherit;
}
.dbf-subscribe__error {
	margin: 0 0 10px;
	padding: 8px 12px;
	border-radius: var(--dbf-radius);
	background: #fdecea;
	color: #8a1c12;
	font-size: 0.9rem;
}
.dbf-subscribe__done {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	border-radius: var(--dbf-radius);
	background: rgba(255, 255, 255, 0.95);
	color: var(--dbf-ink);
}
.dbf-subscribe__done p {
	margin: 0;
}
.dbf-subscribe__done .dbf-icon {
	flex: none;
	color: var(--dbf-cta);
}
@media (max-width: 600px) {
	.dbf-subscribe__fields {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   SITE-SPECIFIC CSS BELOW THIS LINE
   ========================================================================== */