/* ============================================================
   Yachtiva base: reset-lite, typography, layout, shared elements.
   ============================================================ */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--yachtiva-font-sans);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--yachtiva-foreground);
	background: var(--yachtiva-background);
	-webkit-font-smoothing: antialiased;
}

img {
	max-width: 100%;
	height: auto;
}

/* Cover-fit images inside Elementor markup need !important — Elementor's
   own `frontend.css` compound selector beats single-class rules. See
   docs/architecture.md (mirrors Rentiva's documented Elementor pitfall). */
.yachtiva-yacht-card__image,
.yachtiva-hero__inner img,
.yachtiva-testimonial__avatar img {
	height: 100% !important;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--yachtiva-font-display);
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--yachtiva-navy);
	margin: 0 0 0.5em;
}

a {
	color: var(--yachtiva-primary-dark);
	text-decoration: none;
	transition: color 0.25s ease;
}

a:hover {
	color: var(--yachtiva-primary);
}

p {
	margin: 0 0 1em;
}

/* ---------- Layout ---------- */

.yachtiva-container {
	max-width: var(--yachtiva-container);
	margin: 0 auto;
	padding: 0 1.25rem;
}

.site-main {
	min-height: 40vh;
}

/* ---------- Eyebrows / section heads ---------- */

.yachtiva-eyebrow {
	display: inline-block;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--yachtiva-primary-dark);
	margin-bottom: 0.75rem;
}

.yachtiva-eyebrow--light {
	color: var(--yachtiva-primary);
}

.yachtiva-section-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: 2.5rem;
}

.yachtiva-section-head--center {
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.yachtiva-section-head__title {
	font-size: clamp(1.9rem, 1.6rem + 1.5vw, 2.75rem);
	margin: 0;
}

.yachtiva-section-head__sub {
	color: var(--yachtiva-muted-foreground);
	max-width: 56ch;
	margin: 0.75rem 0 0;
}

.yachtiva-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-weight: 600;
	color: var(--yachtiva-navy);
	white-space: nowrap;
}

.yachtiva-link:hover {
	color: var(--yachtiva-primary-dark);
}

/* ---------- Buttons / badges / pills ---------- */

.yachtiva-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.8rem 1.6rem;
	border: 0;
	border-radius: var(--yachtiva-radius-pill);
	background: var(--yachtiva-primary);
	color: #fff;
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.25s var(--yachtiva-ease), transform 0.25s var(--yachtiva-ease), box-shadow 0.25s var(--yachtiva-ease);
}

.yachtiva-btn:hover {
	background: var(--yachtiva-primary-dark);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 8px 24px rgba(176, 138, 62, 0.35);
}

.yachtiva-btn--sm {
	padding: 0.55rem 1.1rem;
	font-size: 0.85rem;
}

.yachtiva-btn--ghost {
	background: transparent;
	border: 1.5px solid currentColor;
	color: inherit;
}

.yachtiva-btn--ghost:hover {
	background: rgba(255, 255, 255, 0.08);
	box-shadow: none;
}

.yachtiva-badge {
	position: absolute;
	top: 0.9rem;
	left: 0.9rem;
	z-index: 1;
	padding: 0.3rem 0.7rem;
	border-radius: var(--yachtiva-radius-pill);
	background: rgba(255, 255, 255, 0.92);
	color: var(--yachtiva-navy);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.yachtiva-pill {
	display: inline-block;
	padding: 0.2rem 0.6rem;
	border-radius: var(--yachtiva-radius-pill);
	background: var(--yachtiva-muted);
	color: var(--yachtiva-muted-foreground);
	font-size: 0.75rem;
	font-weight: 600;
}

.yachtiva-pill.is-ok {
	background: #e6f3ea;
	color: #1B5E3B;
}

/* ---------- Stars ---------- */

.yachtiva-stars {
	display: inline-flex;
	gap: 2px;
	color: var(--yachtiva-border);
}

.yachtiva-stars__star.is-on {
	color: var(--yachtiva-primary);
}

.yachtiva-stars__count {
	color: var(--yachtiva-muted-foreground);
	font-size: 0.85rem;
}

/* ---------- Page heads / empty states ---------- */

.yachtiva-page-head {
	padding: 4.5rem 0 2.5rem;
}

.yachtiva-page-head--center {
	text-align: center;
}

.yachtiva-page-head__title {
	font-size: clamp(2.2rem, 1.7rem + 2.5vw, 3.5rem);
	margin: 0;
}

.yachtiva-page-head__sub {
	color: var(--yachtiva-muted-foreground);
	margin: 0.5rem 0 0;
	font-size: 1.05rem;
}

.yachtiva-page-head__meta {
	color: var(--yachtiva-muted-foreground);
	margin: 0.5rem 0 0;
}

.yachtiva-empty,
.yachtiva-empty-state {
	text-align: center;
	padding: 4rem 0;
	color: var(--yachtiva-muted-foreground);
}

.yachtiva-notice {
	padding: 1rem 1.25rem;
	background: var(--yachtiva-muted);
	border-radius: var(--yachtiva-radius-md);
	color: var(--yachtiva-muted-foreground);
}

/* ---------- Accessibility ---------- */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
}

.screen-reader-text:focus {
	width: auto;
	height: auto;
	clip: auto;
	clip-path: none;
	left: 1rem;
	top: 1rem;
	z-index: 100;
	background: #fff;
	padding: 0.75rem 1rem;
	border-radius: var(--yachtiva-radius-sm);
}