/*
 * Cognixia theme fix-up patch (Nov 2026).
 * Loaded after main.css and responsive.css. Small changes only: no layout changes.
 *  1. Accordion triggers are now <button>s; keep them looking exactly as the old <span>s did.
 *  2. Scroll reveals (AOS): shorter, gentler, run once, and no motion on text.
 *  3. Card motion (Motion / Framer Motion, see assets/cognixia-cards.js): support styles.
 *  4. Reduced motion: honour the operating system setting everywhere.
 */

/* ------------------------------------------------------------------------
 * 1. Accordion <button> triggers
 * The global button styles in main.css (gold background, white text, arrow,
 * 1.2s colour transition, line-height 2, margin) would otherwise apply.
 * Selector weight (0,1,2) beats `html [type=button]` (0,1,1) but stays below
 * `.roundedtogglebtn .accordion-button` (0,2,0), so those padding and font
 * sizes still win, as before.
 * --------------------------------------------------------------------- */
h3 > button.accordion-button {
	display: flex;
	width: 100%;
	margin: 0;
	padding: 8px 16px;
	border: 0;
	background: transparent;
	color: var(--bs-heading-color);
	font-size: large;
	font-weight: inherit;
	font-style: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	text-align: left;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: var(--bs-accordion-transition);
}
/* Global hover/focus/active rules (0,2,0) turn buttons teal; the old span never changed. */
h3 > button.accordion-button:hover,
h3 > button.accordion-button:focus,
h3 > button.accordion-button:active {
	background-color: transparent;
	color: var(--bs-heading-color);
	box-shadow: none;
	outline: none;
}
/* Keyboard focus only: visible ring in brand teal (no ring on mouse click). */
h3 > button.accordion-button:focus-visible {
	outline: 2px solid var(--cognixia-primary);
	outline-offset: 2px;
}

/* ------------------------------------------------------------------------
 * 2. Scroll reveals (AOS)
 * AOS's default zoom-in-up moves elements 100px and scales them to 60%.
 * Now: a short 16px rise with a fade. Duration and once-only are set in main.js.
 * Specificity (0,2,0) beats AOS's start state but not its end state (.aos-animate).
 * --------------------------------------------------------------------- */
[data-aos][data-aos="zoom-in-up"],
[data-aos][data-aos="fade-zoom-in-up"],
[data-aos][data-aos="fade-in-up"] {
	transform: translate3d(0, 16px, 0);
}
[data-aos][data-aos="zoom-in"],
[data-aos][data-aos="fade-zoom-in"] {
	transform: scale(0.97);
}
[data-aos][data-aos="fade-up"] {
	transform: translate3d(0, 16px, 0);
}
/* Text is never animated: headings, labels, paragraphs and list items appear in place. */
html :is(h1, h2, h3, h4, h5, h6, p, label, li, small, blockquote)[data-aos] {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

/* Image zoom on card hover: was 1.15 over 0.3s after a 0.1s delay. */
main .thumbItem:hover .thumb img,
.zoome:hover img {
	transform: scale(1.05);
}
.thumbItem .thumb img,
.zoome img {
	transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
	transition-delay: 0s;
}

/* ------------------------------------------------------------------------
 * 3. Card motion support (assets/cognixia-cards.js)
 * Motion animates the individual `translate`, `scale` and `opacity` properties,
 * so it never fights a `transform` set by other CSS.
 * --------------------------------------------------------------------- */
.cx-card-pending {
	opacity: 0;
}
@media print {
	.cx-card-pending {
		opacity: 1 !important;
	}
}

/* ------------------------------------------------------------------------
 * 4. Reduced motion
 * --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto !important;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		animation-delay: 0s !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0s !important;
	}
	[data-aos] {
		opacity: 1 !important;
		transform: none !important;
	}
	.cx-card-pending {
		opacity: 1 !important;
	}
	main .thumbItem:hover .thumb img,
	.zoome:hover img,
	.section-flip:hover .flip-front img {
		transform: none;
	}
	.moveparallax {
		transform: none !important;
	}
	/* The trailing cursor ring follows the pointer with a lag; hide it. */
	.cursor-circle {
		display: none !important;
	}
}
