/* Freedomcorp Preview - ONE shared button style for every custom preview button.
 * Copies the live home page hero "GET IN TOUCH" button exactly (JetElements button 437c4a07, hover-effect-1),
 * measured 21 Oct 2026:
 *   normal: Oswald 400 uppercase 24px, letter-spacing 1.3px, white, 3px white outline, radius 15px,
 *           padding 10px 30px, box 305 x 67 (mobile <=767px: 14px, box 229 x 51)
 *   hover:  label cross-fades to a SMALLER yellow label (#fff100): 21px, letter-spacing 0.8px (mobile 14px, 0.8px);
 *           outline cross-fades to yellow; no transform; the box does not change size;
 *           transition 0.3s cubic-bezier(0.5, 0.12, 0.46, 0.88).
 * As on the live button, the hover label is a second layer (::after, text from data-label) over the normal label,
 * so the button keeps its size and the layout never jumps.
 *   .fc-btn            dark or photo backgrounds (exact copy)
 *   .fc-btn--navy      light backgrounds: navy outline + navy text; hover fills navy with the yellow label
 *   .fc-btn--sm        smaller in-content tool buttons (print, download, clear ticks, household manager)
 * Loaded on every preview page (the Household Manager button is on non-template pages too). */
a.fc-btn, button.fc-btn {
	--fc-btn-ease: .3s cubic-bezier(0.5, 0.12, 0.46, 0.88);
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	box-sizing: border-box; max-width: 100%; min-height: 67px; margin: 0; vertical-align: middle;
	padding: 10px 30px !important; border: 3px solid #fff !important; border-radius: 15px !important;
	background: transparent !important; color: #fff !important; box-shadow: none !important;
	font-family: Oswald, sans-serif !important; font-weight: 400 !important; font-size: 24px !important;
	letter-spacing: 1.3px !important; line-height: 20px !important; text-transform: uppercase !important;
	text-decoration: none !important; text-align: center; cursor: pointer; transform: none !important;
	transition: color var(--fc-btn-ease), border-color var(--fc-btn-ease), background-color var(--fc-btn-ease) !important;
}
a.fc-btn[data-label]::after, button.fc-btn[data-label]::after {
	content: attr(data-label); content: attr(data-label) / "";
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	box-sizing: border-box; padding: 10px 30px; pointer-events: none;
	color: #fff100; font-size: 21px; letter-spacing: .8px; line-height: 20px;
	opacity: 0; transition: opacity var(--fc-btn-ease);
}
a.fc-btn:hover, button.fc-btn:hover, a.fc-btn:focus-visible, button.fc-btn:focus-visible { border-color: #fff100 !important; text-decoration: none !important; }
a.fc-btn[data-label]:hover, button.fc-btn[data-label]:hover, a.fc-btn[data-label]:focus-visible, button.fc-btn[data-label]:focus-visible { color: transparent !important; }
a.fc-btn:not([data-label]):hover, button.fc-btn:not([data-label]):hover { color: #fff100 !important; }
a.fc-btn:hover::after, button.fc-btn:hover::after, a.fc-btn:focus-visible::after, button.fc-btn:focus-visible::after { opacity: 1; }
a.fc-btn:focus-visible, button.fc-btn:focus-visible { outline: 3px solid #019cdb; outline-offset: 2px; }

/* Light backgrounds: navy outline + navy text; hover fills navy, yellow (smaller) label. */
a.fc-btn.fc-btn--navy, button.fc-btn.fc-btn--navy { color: #223b75 !important; border-color: #223b75 !important; }
a.fc-btn.fc-btn--navy:hover, button.fc-btn.fc-btn--navy:hover, a.fc-btn.fc-btn--navy:focus-visible, button.fc-btn.fc-btn--navy:focus-visible { background-color: #223b75 !important; border-color: #223b75 !important; }
a.fc-btn.fc-btn--navy[data-label]:hover, button.fc-btn.fc-btn--navy[data-label]:hover, a.fc-btn.fc-btn--navy[data-label]:focus-visible, button.fc-btn.fc-btn--navy[data-label]:focus-visible { color: transparent !important; }
a.fc-btn.fc-btn--navy:not([data-label]):hover, button.fc-btn.fc-btn--navy:not([data-label]):hover { color: #fff100 !important; }

/* Smaller tool buttons: same look, scaled (20px -> 17.5px, same letter-spacing change). */
a.fc-btn.fc-btn--sm, button.fc-btn.fc-btn--sm { min-height: 0; padding: 12px 26px !important; font-size: 20px !important; letter-spacing: 1.1px !important; }
a.fc-btn.fc-btn--sm::after, button.fc-btn.fc-btn--sm::after { padding: 12px 26px; font-size: 17.5px; letter-spacing: .7px; }

@media (max-width: 767px) {
	a.fc-btn, button.fc-btn, a.fc-btn.fc-btn--sm, button.fc-btn.fc-btn--sm { min-height: 51px; font-size: 14px !important; letter-spacing: 1.3px !important; line-height: 29px !important; }
	a.fc-btn[data-label]::after, button.fc-btn[data-label]::after, a.fc-btn.fc-btn--sm[data-label]::after, button.fc-btn.fc-btn--sm[data-label]::after { font-size: 14px; letter-spacing: .8px; line-height: 20px; }
}
@media print { .fc-btn { display: none !important; } }
