/*
Theme Name: NLP Lisbon
Theme URI: https://nlplisbon.com
Description: Child theme of Ollie for nlplisbon.com — Lisbon light, azulejo cobalt, tram-yellow CTAs. Conversion-focused patterns for NLP trainings and coaching.
Author: NLP Lisbon
Template: ollie
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nlp-lisbon
*/

/* ==========================================================================
   1. Azulejo tile strip — the signature divider.
   One geometric tile motif, repeated horizontally. Used via the
   "Azulejo Divider" pattern or by adding .nlpl-tile-strip to a Group.
   ========================================================================== */

.nlpl-tile-strip {
	height: 28px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M40 10 L47 33 L70 40 L47 47 L40 70 L33 47 L10 40 L33 33 Z' fill='%231D4E89'/%3E%3Ccircle cx='40' cy='40' r='6' fill='%23FAF7F2'/%3E%3Ccircle cx='40' cy='40' r='6' fill='none' stroke='%231D4E89' stroke-width='2.5'/%3E%3Cpath d='M18 0 A18 18 0 0 1 0 18 M62 0 A18 18 0 0 0 80 18 M0 62 A18 18 0 0 1 18 80 M80 62 A18 18 0 0 0 62 80' fill='none' stroke='%231D4E89' stroke-width='2.5'/%3E%3C/svg%3E");
	background-repeat: repeat-x;
	background-size: 28px 28px;
	background-position: center;
}

/* Light version for dark (Azulejo Night) sections */
.nlpl-tile-strip--light {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M40 10 L47 33 L70 40 L47 47 L40 70 L33 47 L10 40 L33 33 Z' fill='%23E8F0F7'/%3E%3Ccircle cx='40' cy='40' r='6' fill='%2312355B'/%3E%3Ccircle cx='40' cy='40' r='6' fill='none' stroke='%23E8F0F7' stroke-width='2.5'/%3E%3Cpath d='M18 0 A18 18 0 0 1 0 18 M62 0 A18 18 0 0 0 80 18 M0 62 A18 18 0 0 1 18 80 M80 62 A18 18 0 0 0 62 80' fill='none' stroke='%23E8F0F7' stroke-width='2.5'/%3E%3C/svg%3E");
}

/* Large, quiet tile watermark for dark sections (add to a Group) */
.nlpl-tile-watermark {
	position: relative;
	overflow: hidden;
}
.nlpl-tile-watermark::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'%3E%3Cpath d='M40 10 L47 33 L70 40 L47 47 L40 70 L33 47 L10 40 L33 33 Z' fill='%23E8F0F7'/%3E%3C/svg%3E");
	background-repeat: repeat;
	background-size: 160px 160px;
	opacity: .05;
	pointer-events: none;
}
.nlpl-tile-watermark > * { position: relative; }

/* ==========================================================================
   2. Motion — CSS-only, no JS. Falls back to fully visible content in
   older browsers and honors prefers-reduced-motion.
   ========================================================================== */

/* Scroll text-reveal: lines light up as they enter the viewport.
   Use ONLY in the Question Sequence and one manifesto paragraph. */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.nlpl-reveal {
			opacity: .22;
			animation: nlpl-reveal linear both;
			animation-timeline: view();
			animation-range: entry 25% cover 42%;
		}
	}
}
@keyframes nlpl-reveal {
	to { opacity: 1; }
}

/* Gentle fade-up entrance for cards and headings */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.nlpl-fade-up {
			opacity: 0;
			transform: translateY(22px);
			animation: nlpl-fade-up .5s ease-out both;
			animation-timeline: view();
			animation-range: entry 0% entry 45%;
		}
	}
}
@keyframes nlpl-fade-up {
	to { opacity: 1; transform: none; }
}

/* ==========================================================================
   3. Sticky CTA — never leaves the screen after the hero.
   Desktop: pill bottom-right. Mobile: full-width bottom bar.
   ========================================================================== */

.nlpl-sticky-cta {
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 90;
	margin: 0 !important;
}
.nlpl-sticky-cta .wp-block-button__link {
	box-shadow: 0 6px 24px rgba(31, 41, 51, .22);
}
@media (max-width: 781px) {
	.nlpl-sticky-cta {
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: .75rem;
		padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom));
		background: rgba(250, 247, 242, .93);
		backdrop-filter: blur(8px);
		-webkit-backdrop-filter: blur(8px);
		border-top: 1px solid var(--wp--preset--color--border-light);
	}
	.nlpl-sticky-cta .nlpl-sticky-cta__date { margin: 0; }
}
@media (min-width: 782px) {
	.nlpl-sticky-cta .nlpl-sticky-cta__date { display: none; }
}

/* ==========================================================================
   4. Small utilities used by the patterns
   ========================================================================== */

/* Kicker — small uppercase intro line above headlines */
.nlpl-kicker {
	text-transform: uppercase;
	letter-spacing: .14em;
	font-weight: 650;
	font-size: .85rem;
	color: var(--wp--preset--color--primary);
}
.has-primary-alt-accent-background-color .nlpl-kicker,
.has-main-background-color .nlpl-kicker {
	color: var(--wp--preset--color--primary-alt);
}

/* Date badge — tram yellow pill with the next training date */
.nlpl-badge {
	display: inline-block;
	background: var(--wp--preset--color--primary-alt);
	color: var(--wp--preset--color--main);
	border-radius: 999px;
	padding: .35em 1em;
	font-weight: 650;
	font-size: .95rem;
}

/* Numbered chapters — quiet editorial rhythm */
.nlpl-chapter {
	font-variant-numeric: tabular-nums;
	color: var(--wp--preset--color--secondary);
	font-size: .9rem;
	letter-spacing: .08em;
}

/* Slightly warmer default for pale-azulejo cards */
.nlpl-card {
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 14px;
	background: #fff;
}