/* TYW widgets — shared section layout, section header, reveal on scroll. Tokens come from the theme (fallbacks inline). */

.tyw-section {
	padding-block: var(--tyw-section, clamp(4rem, 9vw, 7.5rem));
	color: var(--tyw-ink, #0e1a2b);
}
.tyw-section--dark { background: var(--tyw-navy, #0e1a2b); color: var(--tyw-cream, #f7f5f0); }
.tyw-section--light { background: var(--tyw-cream-2, #efebe2); }
.tyw-section__inner {
	width: 100%;
	max-width: calc(var(--tyw-wrap, 1240px) + 2 * var(--tyw-gutter, 1.5rem));
	margin-inline: auto;
	padding-inline: var(--tyw-gutter, 1.5rem);
}

/* Section header */
.tyw-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem 2rem;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.tyw-section__head-text { max-width: 46rem; }
.tyw-section__eyebrow {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	margin: 0 0 1rem;
	color: var(--tyw-gold-text, #7f6036);
	font: 500 0.8125rem/1.4 var(--tyw-font-body, sans-serif);
	letter-spacing: 0.22em;
	text-transform: uppercase;
}
.tyw-section__eyebrow::before {
	content: "";
	width: 2.5rem;
	height: 1px;
	background: var(--tyw-gold, #b58d59);
}
.tyw-section__title { margin: 0; }
.tyw-section__intro {
	margin: 1.25rem 0 0;
	color: var(--tyw-muted, #4a5566);
	font-size: 1.125rem;
}
.tyw-section__link {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 2.75rem;
	color: inherit;
	font: 500 0.8125rem/1.2 var(--tyw-font-body, sans-serif);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: 1px solid var(--tyw-gold, #b58d59);
}
.tyw-section__link .tyw-svg { width: 1.1em; height: 1.1em; transition: transform 0.25s ease; }
.tyw-section__link:hover .tyw-svg { transform: translateX(4px); }

.tyw-section__head--dark .tyw-section__eyebrow,
.tyw-section--dark .tyw-section__eyebrow { color: var(--tyw-gold, #b58d59); }
.tyw-section__head--dark .tyw-section__intro { color: rgb(247 245 240 / 0.8); }
.tyw-section__head--dark .tyw-section__link:hover { color: var(--tyw-gold, #b58d59); }

/* Reveal on scroll (progressive enhancement: hidden only after JS marks an element as pending
   below the first viewport; nothing is hidden without JS, above the fold, or for crawlers). */
[data-tyw-reveal="1"] { --tyw-d: 90ms; }
[data-tyw-reveal="2"] { --tyw-d: 180ms; }
[data-tyw-reveal="3"] { --tyw-d: 270ms; }
@media (prefers-reduced-motion: no-preference) {
	.tyw-js [data-tyw-reveal].is-pending { opacity: 0; translate: 0 18px; }
	.tyw-js [data-tyw-reveal].is-visible {
		transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1) var(--tyw-d, 0ms), translate 0.7s cubic-bezier(0.22, 1, 0.36, 1) var(--tyw-d, 0ms), filter 0.7s cubic-bezier(0.22, 1, 0.36, 1) var(--tyw-d, 0ms);
	}
	/* Blur only where it is cheap: fine pointers (desktop). */
	@media (hover: hover) and (pointer: fine) {
		.tyw-js [data-tyw-reveal].is-pending { filter: blur(4px); }
	}

	/* Section header: title rises out of a mask, the gold eyebrow line draws, the rest fades. */
	.tyw-js .tyw-section__head.is-pending,
	.tyw-js .tyw-cta__inner.is-pending { opacity: 1; translate: none; filter: none; }
	.tyw-js .is-pending :is(.tyw-section__title, .tyw-cta__title) {
		clip-path: inset(0 0 100% 0);
		translate: 0 0.45em;
	}
	.tyw-js .is-visible :is(.tyw-section__title, .tyw-cta__title) {
		clip-path: inset(-0.3em -0.1em -0.3em -0.1em);
		translate: none;
		transition: clip-path 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.15s, translate 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.15s;
	}
	.tyw-js .is-pending .tyw-section__eyebrow::before,
	.tyw-js .is-pending .tyw-section__eyebrow::after { scale: 0 1; }
	.tyw-js .is-visible .tyw-section__eyebrow::before { transform-origin: left; transition: scale 0.8s cubic-bezier(0.22, 1, 0.36, 1); }
	.tyw-js .is-visible .tyw-section__eyebrow::after { transform-origin: right; transition: scale 0.8s cubic-bezier(0.22, 1, 0.36, 1); }
	.tyw-js .is-pending :is(.tyw-section__intro, .tyw-section__link, .tyw-cta__text, .tyw-cta__actions) { opacity: 0; translate: 0 10px; }
	.tyw-js .is-visible :is(.tyw-section__intro, .tyw-section__link, .tyw-cta__text, .tyw-cta__actions) {
		transition: opacity 0.7s ease 0.45s, translate 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.45s;
	}
}

/* Parallax image frame (scroll-driven, compositor-only, no JS; static where unsupported). */
.tyw-parallax { position: relative; margin: 0; overflow: hidden; background: var(--tyw-navy-2, #16263c); }
.tyw-parallax__image { width: 100%; height: 100%; object-fit: cover; }
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.tyw-parallax__image {
			scale: 1.16;
			animation: tyw-parallax linear both;
			animation-timeline: view();
			animation-range: cover 0% cover 100%;
		}
	}
}
@keyframes tyw-parallax {
	from { translate: 0 -6%; }
	to { translate: 0 6%; }
}
.tyw-btn .tyw-svg { width: 1.1em; height: 1.1em; transition: transform 0.25s ease; }
.tyw-btn:hover .tyw-svg { transform: translateX(3px); }

/* Section background override (owner colour rule: never two same colours in a row). */
.tyw-section.tyw-bg--cream { background: var(--tyw-cream, #f7f5f0); }
.tyw-section.tyw-bg--cream2 { background: var(--tyw-cream-2, #efebe2); }
.tyw-section.tyw-bg--white { background: var(--tyw-white, #fff); }