/**
 * Kanubar Responsive Fine-Tuning
 * Breakpoint-specific adjustments beyond the base grid layouts
 * Loaded on ALL pages after page-specific CSS
 */

/* === SMALL MOBILE (< 375px) === */

@media (max-width: 374px) {
	.hero__title {
		font-size: 1.75rem;
	}

	.hero__ctas .btn {
		width: 100%;
	}

	.boat-card__prices {
		flex-direction: column;
		gap: var(--space-sm);
	}

	.price-tag {
		font-size: 1.25rem;
	}

	.route-card__stats {
		flex-wrap: wrap;
	}

	.steps {
		gap: var(--space-lg);
	}

	.contact-phone a {
		font-size: var(--text-h3);
	}
}

/* === TABLET (768px+) === */

@media (min-width: 768px) {
	.section {
		padding-top: var(--space-3xl);
		padding-bottom: var(--space-3xl);
	}

	.hero__content {
		max-width: 600px;
	}

	.page-header {
		padding: var(--space-3xl) 0 var(--space-2xl);
	}

	.step-detail {
		align-items: center;
	}

	.faq-category {
		margin-bottom: var(--space-3xl);
	}
}

/* === DESKTOP (1024px+) === */

@media (min-width: 1024px) {
	.section {
		padding-top: var(--space-4xl);
		padding-bottom: var(--space-4xl);
	}

	.section__title {
		margin-bottom: var(--space-3xl);
	}

	.page-header {
		padding: var(--space-4xl) 0 var(--space-3xl);
	}

	.page-content {
		max-width: 800px;
	}

	.page-content--wide {
		max-width: 1000px;
	}

	.hero__content {
		max-width: 700px;
	}

	.boat-detail {
		gap: var(--space-3xl);
	}
}

/* === WIDE DESKTOP (1440px+) === */

@media (min-width: 1440px) {
	.container {
		max-width: 1200px;
	}

	.section {
		padding-top: var(--space-4xl);
		padding-bottom: var(--space-4xl);
	}

	.hero__content {
		max-width: 800px;
	}
}

/* === LANDSCAPE PHONES === */

@media (max-height: 500px) and (orientation: landscape) {
	.hero {
		min-height: 100vh;
	}

	.page-header {
		padding: var(--space-xl) 0;
	}
}

/* === HOVER CAPABILITY (desktop/mouse) === */

@media (hover: hover) {
	.card:hover {
		transform: translateY(-2px);
	}

	.accordion__trigger:hover {
		color: var(--color-primary);
	}

	.btn-primary:hover {
		transform: translateY(-1px);
	}
}

/* === PRINT === */

@media print {
	/* Hide interactive/non-essential elements */
	.nav-header,
	.hamburger,
	.mobile-menu,
	.sticky-cta,
	.btn,
	.section__cta,
	.hero__ctas,
	.contact-map iframe {
		display: none !important;
	}

	/* Reset backgrounds and colors */
	body {
		background: white !important;
		color: black !important;
		padding: 0 !important;
		font-size: 12pt;
	}

	.hero {
		min-height: auto !important;
		background: none !important;
		padding: 20pt 0;
	}

	.hero__overlay {
		display: none !important;
	}

	.hero__title,
	.hero__subtitle {
		color: black !important;
		text-shadow: none !important;
	}

	.site-footer {
		background: none !important;
		color: black !important;
		border-top: 1pt solid #ccc;
		padding: 10pt 0;
	}

	.site-footer a {
		color: black !important;
	}

	.section--muted {
		background: none !important;
	}

	/* Make prices prominent */
	.price-tag {
		font-size: 14pt !important;
		font-weight: bold !important;
	}

	.price-comparison-table {
		border: 1pt solid #ccc;
	}

	.price-comparison-table th {
		background: #eee !important;
		color: black !important;
	}

	.price-comparison-table td {
		border: 1pt solid #ccc;
	}

	/* Show phone number prominently */
	.contact-phone a::after {
		content: " (" attr(href) ")";
		font-size: 10pt;
	}

	/* Show URLs for links */
	a[href^="tel:"]::after {
		content: " [" attr(href) "]";
		font-size: 9pt;
		color: #666;
	}

	/* Expand all accordions */
	.accordion__panel {
		max-height: none !important;
		display: block !important;
	}

	.accordion__panel[hidden] {
		display: block !important;
	}

	.accordion__icon {
		display: none !important;
	}

	/* Page breaks */
	.section {
		page-break-inside: avoid;
	}

	h1, h2, h3 {
		page-break-after: avoid;
	}
}