.ff-section { padding-block: var(--ff-space-xl); }
.ff-container { margin-inline: auto; max-width: var(--ff-content-width); padding-inline: clamp(1rem, 3vw, 2.5rem); width: 100%; }
.ff-cream-section { background: var(--ff-color-cream); color: var(--ff-color-night); }
.ff-dark-section { background: var(--ff-color-court); color: var(--ff-color-white); }

.ff-card { border-radius: var(--ff-radius-sm); min-width: 0; overflow: hidden; position: relative; }
.ff-story-card,
.ff-court-card,
.ff-person-card,
.ff-video-card { background: var(--ff-color-night); color: var(--ff-color-white); isolation: isolate; min-height: 22rem; }
.ff-story-card--large { min-height: clamp(28rem, 52vw, 44rem); }
.ff-card img { height: 100%; inset: 0; object-fit: cover; position: absolute; transition: transform .45s ease; width: 100%; z-index: -2; }
.ff-card::after { background: linear-gradient(180deg, transparent 30%, rgba(11, 15, 17, .88)); content: ""; inset: 0; pointer-events: none; position: absolute; z-index: -1; }
.ff-card > .elementor-element,
.ff-card__content { align-items: flex-start; display: flex; flex-direction: column; height: 100%; justify-content: flex-end; padding: var(--ff-space-md); }
@media (hover: hover) and (pointer: fine) { .ff-card:hover img { transform: scale(1.035); } }

.ff-button .elementor-button,
a.ff-button,
button.ff-button {
	align-items: center;
	border: 1px solid currentColor;
	border-radius: var(--ff-radius-sm);
	display: inline-flex;
	font-size: .75rem;
	font-weight: 800;
	gap: .75rem;
	justify-content: center;
	letter-spacing: .04em;
	min-height: 46px;
	padding: .85rem 1.25rem;
	text-decoration: none;
	text-transform: uppercase;
}
.ff-button--primary .elementor-button,
a.ff-button--primary,
button.ff-button--primary { background: var(--ff-color-white); border-color: var(--ff-color-white); color: var(--ff-color-night); }
.ff-button--secondary .elementor-button,
a.ff-button--secondary,
button.ff-button--secondary { background: transparent; color: inherit; }

.ff-newsletter { align-items: center; background: var(--ff-color-court); color: var(--ff-color-white); display: grid; gap: var(--ff-space-lg); grid-template-columns: minmax(0, .8fr) minmax(18rem, 1.2fr); padding: var(--ff-space-lg); }
.ff-newsletter :where(input[type="email"], input[type="text"]) { background: var(--ff-color-paper); border: 0; border-radius: var(--ff-radius-sm); color: var(--ff-color-night); min-height: 48px; padding-inline: 1rem; width: 100%; }
.ff-quote { font-family: var(--ff-font-editorial); font-size: clamp(2rem, 4vw, 4.5rem); line-height: .98; }
.ff-court-line { background-image: linear-gradient(90deg, transparent 49.7%, rgba(255,255,255,.65) 49.7%, rgba(255,255,255,.65) 50.3%, transparent 50.3%); }

.ff-loop-asymmetric { display: grid; gap: var(--ff-space-sm); grid-template-columns: 1.35fr .65fr .65fr; }
.ff-loop-asymmetric > :first-child { grid-row: span 2; }
.ff-content-world-grid { display: grid; gap: var(--ff-space-md); grid-template-columns: repeat(5, minmax(0, 1fr)); }

.ff-sr-only { clip: rect(0, 0, 0, 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
