/* Hallmark v2.0.0 · page: Rent Your Home ([ct_rent_form]) · system: locked, the approved Sell Your Home design (costa-tropical-sell.css, version C) · genre: editorial · nav: the site's Astra header · footer: the site's Astra footer · hero: split, headline and actions left, photo right (photo first on phones) · signature: the slate "You keep the home" band under the hero · material real: services Casero runs today, Andalucía rules (Decreto 31/2024, SES Hospedajes, Modelo 210), office contacts · pictures: owner-supplied generated image of a holiday-let roof terrace (no real home, no caption) · absent: prices, fee rates, earnings figures, reviews, logos */
/* critique: one idea per band; the services list is the long one and stays two columns of short lines; no invented figures, the earnings estimate is promised, never shown */
/* Long page (about 1,100 words) on purpose: a sibling of the Sell page, and the owner asked for every benefit to be listed; each band still carries one idea. */
/* ==========================================================================
   Rent Your Home page. Loads after costa-tropical-sell.css and only adds what
   this page has that the Sell page does not. Every rule is scoped under
   .ct-rent; colours and fonts come from the .ct-sell tokens.
   ========================================================================== */

.ct-rent .hero-figure img { object-position: 50% 60%; }
/* The headline block sits level with the middle of the photo, not hanging off its bottom edge. */
.ct-rent .hero .wrap { align-items: center; }

/* Line the page up with the site header: from 922 px Astra's header is 1240 px wide with 20 px sides,
   so the logo and the heart sit on the same left and right edges as every band below. */
@media (min-width: 922px) {
	.ct-rent .wrap { max-width: 1240px; padding-left: 20px; padding-right: 20px; }
}

/* The form band is beige after a white band, so it needs its own top space
   (the Sell rule .section + .section removes it). */
.ct-rent .section + .section.sell { padding-top: clamp(56px, 7vw, 96px); }

/* Labels in sentence case, untracked. */
.ct-rent .steps .when { letter-spacing: normal; text-transform: none; font-size: calc(.88 * var(--rem)); }
.ct-rent .docs .tag { letter-spacing: normal; text-transform: none; font-size: calc(.8 * var(--rem)); vertical-align: 1px; }

/* --------------------------------------------------- the ownership band */

.ct-rent .yours { background: var(--slate); color: var(--on-slate); padding-block: clamp(48px, 6vw, 80px); }
.ct-rent .yours + .section { padding-top: clamp(56px, 7vw, 96px); }
.ct-rent .yours .wrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.ct-rent .yours h2 {
	color: var(--on-slate);
	font-size: clamp(calc(1.9 * var(--rem)), 3.4vw, calc(2.8 * var(--rem)));
	overflow-wrap: break-word;
	min-width: 0;
	text-wrap: balance;
}
.ct-rent .yours-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 36px; }
.ct-rent .yours-list li { margin: 0; padding-top: 16px; border-top: 1.5px solid var(--gold); color: var(--on-slate-soft); font-size: calc(1 * var(--rem)); }
.ct-rent .yours-list b { display: block; margin-bottom: 8px; font: 500 calc(1.25 * var(--rem))/1.25 var(--f-display); color: var(--on-slate); }
@media (max-width: 860px) {
	.ct-rent .yours .wrap { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
	.ct-rent .yours-list { grid-template-columns: 1fr; gap: 24px; }
}

/* ---------------------------------------------------- what we do for you */

.ct-rent .perks .es { font-style: normal; }
.ct-rent .perks p a { color: var(--teal); }
.ct-rent .section-head p a { color: var(--teal); }

/* Focus and press states for the links this page adds (the rest come from costa-tropical-sell.css). */
.ct-rent a:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; border-radius: 3px; }
.ct-rent .btn:active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) { .ct-rent .btn:active { transform: none; } }