/**
 * IV Tours USA Ads — responsive behaviour.
 *
 * Breakpoints: 1280, 1024, 834, 768, 600, 430, 360 plus landscape phones.
 *
 * The pinned horizontal journey is a desktop-only enhancement. Below 1024px the
 * section is a normal-height touch carousel, so vertical scrolling on a phone is
 * never intercepted.
 */

/* -------------------------------------------------------------------------
 * ≤ 1280px
 * ---------------------------------------------------------------------- */

@media (max-width: 1280px) {
	.ads-container {
		--ads-gutter: clamp(1.1rem, 0.6rem + 2vw, 2.5rem);
	}

	.ads-where__track > * {
		flex-basis: calc((100% - 2 * clamp(1rem, 1.8vw, 1.75rem)) / 2.2);
	}
}

/* -------------------------------------------------------------------------
 * ≤ 1024px — tablet, and where the pin is disabled
 * ---------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.ads-nav {
		display: none;
	}

	.ads-nav-toggle {
		display: inline-flex;
	}

	.ads-header__actions {
		margin-inline-start: auto;
	}

	.ads-hero {
		min-height: auto;
		padding-top: calc(var(--ads-header-h) + 3.5rem);
		padding-bottom: 4.5rem;
	}

	/* Unpin: the track becomes a swipeable carousel at natural height. */
	.ads-where__pin {
		position: static;
		height: auto;
		max-height: none;
		min-height: 0;
		padding-block: var(--ads-2xl);
		overflow: visible;
	}

	.ads-where {
		height: auto !important;
	}

	.ads-where__head {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--ads-sm);
	}

	.ads-where__track {
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
	}

	.ads-where__track > * {
		flex: 0 0 min(78%, 420px);
	}

	.ads-where__hint {
		display: none;
	}

	.ads-styles__grid,
	.ads-why__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ads-comp-band__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-faq__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-faq__aside {
		position: static;
	}

	.ads-footer__top {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Reduced overlap on tablet. */
	.ads-comp {
		min-height: 300px;
		max-width: 620px;
		margin-inline: auto;
	}
}

/* -------------------------------------------------------------------------
 * ≤ 834px
 * ---------------------------------------------------------------------- */

@media (max-width: 834px) {
	.ads-section {
		padding-block: var(--ads-xl);
	}

	.ads-quotes__grid {
		columns: 2 18rem;
	}

	.ads-where__track > * {
		flex-basis: min(80%, 380px);
	}

	.ads-packages__grid,
	.ads-services__grid,
	.ads-vehicles__categories {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-fleet__list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -------------------------------------------------------------------------
 * ≤ 768px
 * ---------------------------------------------------------------------- */

@media (max-width: 768px) {
	.ads-styles__grid,
	.ads-why__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-modal__form {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-footer__columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* -------------------------------------------------------------------------
 * ≤ 600px
 * ---------------------------------------------------------------------- */

@media (max-width: 600px) {
	.ads-topbar__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.3rem;
		padding-block: 0.55rem;
	}

	.ads-topbar__links {
		flex-wrap: wrap;
		gap: 0.6rem 0.9rem;
	}

	.ads-header__cta {
		display: none;
	}

	.ads-hero__actions .ads-btn {
		width: 100%;
	}

	.ads-hero__trust {
		font-size: var(--ads-size-tiny);
	}

	.ads-quotes__grid {
		columns: 1;
	}

	.ads-footer__columns {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-final__actions,
	.ads-comp-band__actions,
	.ads-modal__success-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.ads-final__actions .ads-btn,
	.ads-comp-band__actions .ads-btn,
	.ads-modal__success-actions .ads-btn {
		width: 100%;
	}

	/* Clean stacked composition: no overlap, no overflow, no clipping. */
	.ads-comp {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.75rem;
		min-height: 0;
		max-width: none;
	}

	.ads-comp__item {
		position: static;
		width: auto;
		transform: none;
	}

	.ads-comp__item--1,
	.ads-comp__item--2 {
		aspect-ratio: 3 / 4;
	}

	.ads-comp__item--3 {
		grid-column: 1 / -1;
		aspect-ratio: 16 / 9;
	}

	.ads-fleet__item {
		grid-template-columns: 60px minmax(0, 1fr);
		row-gap: 0.3rem;
	}

	.ads-fleet__price {
		grid-column: 2;
	}

	.ads-floating__label {
		font-size: var(--ads-size-tiny);
	}

	.ads-floating__btn {
		padding: 0.75rem 1rem;
	}
}

/* -------------------------------------------------------------------------
 * ≤ 430px
 * ---------------------------------------------------------------------- */

@media (max-width: 430px) {
	.ads-container {
		--ads-gutter: 1.05rem;
	}

	.ads-where__track > * {
		flex-basis: 84%;
	}

	.ads-dest__media {
		aspect-ratio: 3 / 4;
	}

	.ads-modal {
		width: 100%;
		max-width: 100%;
		height: 100%;
		max-height: 100%;
		margin: 0;
	}

	.ads-modal__panel {
		max-height: 100%;
		height: 100%;
		border-radius: 0;
		padding-top: 3.25rem;
	}
}

/* -------------------------------------------------------------------------
 * ≤ 360px
 * ---------------------------------------------------------------------- */

@media (max-width: 360px) {
	.ads-where__track > * {
		flex-basis: 88%;
	}

	.ads-btn {
		padding: 0.9em 1.15em;
		font-size: 0.9rem;
	}

	.ads-currency__toggle {
		padding: 0.55em 0.7em;
	}
}

/* -------------------------------------------------------------------------
 * Landscape phones — the pinned section would be unusable
 * ---------------------------------------------------------------------- */

@media (max-height: 560px) and (orientation: landscape) {
	.ads-where__pin {
		position: static;
		height: auto;
		max-height: none;
		min-height: 0;
		padding-block: var(--ads-xl);
		overflow: visible;
	}

	.ads-where {
		height: auto !important;
	}

	.ads-where__track > * {
		flex-basis: min(70%, 340px);
	}

	.ads-hero {
		min-height: 82vh;
	}

	.ads-mobile-nav {
		padding-top: var(--ads-header-h);
	}
}

/* -------------------------------------------------------------------------
 * Pointer and motion preferences
 * ---------------------------------------------------------------------- */

@media (hover: none) {
	.ads-dest:hover,
	.ads-style:hover,
	.ads-pkg:hover,
	.ads-service:hover,
	.ads-vehicle:hover,
	.ads-btn:hover {
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ads-where__hint .ads-icon {
		animation: none;
	}
}

/* -------------------------------------------------------------------------
 * Print
 * ---------------------------------------------------------------------- */

@media print {
	.ads-topbar,
	.ads-header,
	.ads-floating,
	.ads-modal,
	[data-reveal] {
		display: none !important;
	}

	body {
		background: #fff;
		color: #000;
	}

	.ads-section,
	.ads-section--ink,
	.ads-final,
	.ads-where {
		background: none !important;
		color: #000 !important;
		padding-block: 1rem;
	}

	.ads-where__pin {
		position: static;
		height: auto;
	}
}

/* -------------------------------------------------------------------------
 * Page templates
 * ---------------------------------------------------------------------- */

@media (max-width: 900px) {
	.ads-detail,
	.ads-vehicle-detail {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-detail__aside {
		position: static;
	}
}

@media (max-width: 600px) {
	.ads-booking__price,
	.ads-vehicle-detail__price {
		font-size: var(--ads-size-h4);
	}

	.ads-search {
		flex-direction: column;
	}

	.ads-search .ads-btn {
		width: 100%;
	}
}

/* -------------------------------------------------------------------------
 * Restored approved sections
 * ---------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.ads-planner__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ads-intro__grid,
	.ads-transfer__grid,
	.ads-custom__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Reduced overlap on tablet keeps the composition clear of the copy. */
	.ads-intro .ads-comp,
	.ads-transfer .ads-comp,
	.ads-custom .ads-comp {
		max-width: 560px;
	}

	.ads-process__timeline {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--ads-lg) var(--ads-md);
	}

	.ads-process__timeline::before {
		display: none;
	}
}

@media (max-width: 768px) {
	.ads-planner {
		margin-top: -2.5rem;
	}

	.ads-planner__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-planner__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.ads-planner__actions .ads-btn {
		width: 100%;
	}

	.ads-planner__hint {
		text-align: center;
	}

	.ads-process__timeline {
		grid-template-columns: minmax(0, 1fr);
		text-align: left;
		gap: var(--ads-md);
	}

	.ads-process__step {
		flex-direction: row;
		align-items: flex-start;
		text-align: left;
		gap: 0.9rem;
		padding-bottom: var(--ads-md);
		border-bottom: 1px solid var(--ads-border);
	}

	.ads-process__icon {
		margin-top: 0.55rem;
	}

	.ads-process__text {
		max-width: none;
	}

	.ads-process__actions {
		justify-content: flex-start;
	}

	.ads-fleet {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 600px) {
	.ads-transfer__features {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-transfer__airports {
		flex-wrap: wrap;
	}

	.ads-custom__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.ads-custom__actions .ads-btn {
		width: 100%;
	}

	.ads-chauffeur__services-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.ads-fleet__item {
		grid-template-columns: 68px minmax(0, 1fr);
		row-gap: 0.3rem;
	}

	.ads-fleet__price {
		grid-column: 2;
	}

	/* Clean stacked composition: no overlap, no overflow, no clipping. */
	.ads-intro .ads-comp,
	.ads-transfer .ads-comp,
	.ads-custom .ads-comp {
		min-height: 0;
		max-width: none;
	}
}
