/* ==========================================================================
   Private VIP Alcatraz landing page
   Layered on top of the TravelTour theme — brand tokens taken from the live
   traveltour-style-custom.css so the page reads as Must See, not as a plugin.
   ========================================================================== */

.msv-hero,
.msv-quickfacts,
.msv-experience,
.msv-behind,
.msv-planner,
.msv-inquire,
.msv-kbyg { --msv-accent: #00accd; --msv-navy: #003d4a; --msv-ink: #3a3a3a; }

/* ------------------------------------------------------------------ hero -- */

/* Darken the photograph enough to hold white type at any crop. */
.msv-hero .gdlr-core-pbf-background-wrap:after {
	content: "";
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	background: linear-gradient(100deg, rgba(0, 27, 34, 0.93) 0%, rgba(0, 36, 45, 0.80) 45%, rgba(0, 45, 56, 0.46) 100%);
}
.msv-hero .gdlr-core-pbf-wrapper-container { position: relative; z-index: 2; }

.msv-hero h1 { line-height: 1.12; letter-spacing: -0.5px; max-width: 15em; }
.msv-hero-sub p { color: rgba(255, 255, 255, 0.86); line-height: 1.65; max-width: 34em; margin-bottom: 0; }

.msv-hero-cta .gdlr-core-button {
	font-weight: 600;
	letter-spacing: 0.6px;
	text-transform: none;
	transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}
.msv-hero-cta .gdlr-core-button:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(0, 0, 0, 0.28); }

/* ----------------------------------------------------------- quick facts -- */

.msv-quickfacts .gdlr-core-column-service-item { text-align: center; }
.msv-quickfacts .gdlr-core-column-service-title {
	color: var(--msv-navy);
	font-size: 21px !important;
	letter-spacing: -0.2px;
}
.msv-quickfacts .gdlr-core-column-service-content {
	color: #6d7d82;
	font-size: 14px !important;
	line-height: 1.55;
}

/* ------------------------------------------------------------- editorial -- */

.msv-lead p { color: #55666b; line-height: 1.75; margin-bottom: 0; }
.msv-experience .gdlr-core-column-service-title { color: var(--msv-navy); }
.msv-experience .gdlr-core-column-service-content { color: #56676c; line-height: 1.7; }

/* --------------------------------------------------- behind the scenes --- */

.msv-behind .gdlr-core-column-service-content,
.msv-behind .gdlr-core-icon-list-content,
.msv-behind p { color: rgba(255, 255, 255, 0.82); }

.msv-behind .msv-icon-list .gdlr-core-icon-list-item {
	border: 0;
	padding: 0 0 22px;
	line-height: 1.65;
	font-size: 16px;
}
.msv-behind .msv-icon-list .gdlr-core-icon-list-icon { color: var(--msv-accent); }

/* Stand-in block shown until approved photography is supplied. */
.msv-image-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 320px;
	padding: 30px;
	text-align: center;
	border: 1px dashed rgba(255, 255, 255, 0.38);
	border-radius: 4px;
	color: rgba(255, 255, 255, 0.72);
	font-size: 15px;
	line-height: 1.6;
}
.msv-image-placeholder small { opacity: 0.72; font-size: 13px; }

/* ------------------------------------------------------ planner details -- */

.msv-planner .msv-spec { width: 100%; border-collapse: collapse; margin: 0; }
.msv-planner .msv-spec th,
.msv-planner .msv-spec td {
	padding: 16px 0;
	border-bottom: 1px solid #e6ecee;
	vertical-align: top;
	font-size: 15px;
	line-height: 1.6;
	text-align: left;
}
.msv-planner .msv-spec th {
	width: 38%;
	padding-right: 24px;
	color: var(--msv-navy);
	font-weight: 600;
	white-space: nowrap;
}
.msv-planner .msv-spec td { color: #55666b; }
.msv-planner .msv-spec tr:last-child th,
.msv-planner .msv-spec tr:last-child td { border-bottom: 0; }

.msv-inclusions { border-radius: 4px; }
.msv-inclusions .gdlr-core-icon-list-item {
	border: 0;
	padding: 0 0 13px;
	font-size: 15px;
	line-height: 1.55;
	color: #4a5b60;
}
.msv-inclusions .gdlr-core-icon-list-icon { color: var(--msv-accent); font-size: 13px; }

.msv-trust p {
	margin: 12px 0 0;
	padding: 18px 22px;
	border-left: 3px solid var(--msv-accent);
	background: #f4f8f9;
	color: #4a5b60;
	font-size: 15px;
	line-height: 1.6;
}

/* ---------------------------------------------------- inquiry / final CTA -- */

.msv-inquire .gdlr-core-pbf-background-wrap:after {
	content: "";
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	background: rgba(0, 40, 50, 0.82);
}
.msv-inquire .gdlr-core-pbf-wrapper-container { position: relative; z-index: 2; }
.msv-inquire-lead p { color: rgba(255, 255, 255, 0.85); line-height: 1.7; }
.msv-inquire-lead .msv-bestfor { font-size: 15px; color: rgba(255, 255, 255, 0.66); margin-bottom: 0; }

.msv-form-wrap { float: none !important; margin: 0 auto !important; }
.msv-form-wrap .wpcf7 {
	background: #ffffff;
	border-radius: 4px;
	padding: 42px 44px 36px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22);
}

/* Persistent labels — never placeholder-as-label. */
.msv-field { margin-bottom: 22px; }
.msv-field label {
	display: block;
	margin-bottom: 8px;
	color: var(--msv-navy);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.2px;
}
.msv-field .msv-req { color: #8b9aa0; font-weight: 400; }
.msv-field .msv-help {
	display: block;
	margin-top: 7px;
	color: #7d8c91;
	font-size: 13px;
	line-height: 1.5;
}
.msv-form-wrap input[type="text"],
.msv-form-wrap input[type="email"],
.msv-form-wrap select,
.msv-form-wrap textarea {
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 13px 15px;
	border: 1px solid #d5dfe2;
	border-radius: 3px;
	background: #ffffff;
	color: var(--msv-ink);
	font-size: 15px;
	line-height: 1.4;
}
.msv-form-wrap textarea { resize: vertical; min-height: 110px; }
.msv-form-wrap input[type="text"]:focus,
.msv-form-wrap input[type="email"]:focus,
.msv-form-wrap select:focus,
.msv-form-wrap textarea:focus {
	border-color: var(--msv-accent);
	outline: 2px solid rgba(0, 172, 205, 0.22);
	outline-offset: 0;
}
.msv-submit { margin-top: 30px; }
.msv-form-wrap input[type="submit"] {
	width: 100%;
	padding: 17px 30px;
	border: 0;
	border-radius: 3px;
	background: var(--msv-accent);
	color: #ffffff;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.4px;
	cursor: pointer;
	transition: background-color 0.18s ease;
}
.msv-form-wrap input[type="submit"]:hover { background: #0295b3; }
.msv-form-wrap .wpcf7-spinner { display: block; margin: 12px auto 0; }
.msv-form-wrap .wpcf7-not-valid-tip { margin-top: 6px; color: #c0392b; font-size: 13px; }
.msv-form-wrap .wpcf7-response-output {
	margin: 24px 0 0 !important;
	padding: 16px 18px !important;
	border-radius: 3px;
	font-size: 15px;
	line-height: 1.6;
}

/* --------------------------------------------------- know before you go -- */

.msv-kbyg .gdlr-core-accordion-item-title {
	color: var(--msv-navy);
	font-size: 16px;
	font-weight: 600;
}
.msv-kbyg .gdlr-core-accordion-item-content { color: #55666b; line-height: 1.7; font-size: 15px; }

/* ---------------------------------------------------------------- mobile -- */

@media only screen and (max-width: 999px) {
	.msv-hero h1 { font-size: 40px !important; }
	.msv-hero .gdlr-core-pbf-column { width: 100%; }
}

@media only screen and (max-width: 767px) {
	.msv-hero { text-align: left; }
	.msv-hero h1 { font-size: 32px !important; }
	.msv-hero .gdlr-core-pbf-wrapper-content { padding-top: 0; }

	/* The four quick facts stay a 2 x 2 grid at phone width. */
	.msv-quickfacts .gdlr-core-pbf-column.gdlr-core-column-15 {
		width: 50% !important;
		float: left !important;
		clear: none !important;
	}
	.msv-quickfacts .gdlr-core-pbf-column.gdlr-core-column-15:nth-child(2n+1) { clear: both !important; }
	.msv-quickfacts .gdlr-core-column-service-title { font-size: 18px !important; }

	/* Benefit cards stack, one per row. */
	.msv-experience .gdlr-core-pbf-column.gdlr-core-column-15 { width: 100% !important; }

	.msv-planner .msv-spec th,
	.msv-planner .msv-spec td { display: block; width: auto; white-space: normal; }
	.msv-planner .msv-spec th { padding: 16px 0 4px; border-bottom: 0; }
	.msv-planner .msv-spec td { padding-top: 0; }

	.msv-form-wrap .wpcf7 { padding: 28px 22px 24px; }
	.msv-image-placeholder { min-height: 200px; }
}

/* Sticky Request Availability bar — keeps the primary CTA reachable on phones. */
.msv-sticky-cta { display: none; }

@media only screen and (max-width: 767px) {
	.msv-sticky-cta {
		display: block;
		position: fixed;
		right: 0; bottom: 0; left: 0;
		z-index: 9998;
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
		background: rgba(0, 61, 74, 0.97);
		transform: translateY(110%);
		transition: transform 0.25s ease;
	}
	.msv-sticky-cta.msv-visible { transform: translateY(0); }
	.msv-sticky-cta a {
		display: block;
		padding: 15px 20px;
		border-radius: 3px;
		background: var(--msv-accent, #00accd);
		color: #ffffff;
		font-size: 15px;
		font-weight: 600;
		text-align: center;
		text-decoration: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.msv-hero-cta .gdlr-core-button,
	.msv-sticky-cta { transition: none; }
}

/* ==========================================================================
   Overrides for theme and builder defaults
   Two global rules fight this page, so they are neutralised here rather than
   changed site-wide, where they are doing their job on other templates.
   ========================================================================== */

/* Theme Options sets `table tr th { background:#00accd; color:#fff }` for the
   WooCommerce tables. On the planner spec sheet that painted every label cell
   solid cyan, so scope it back for this one table. */
.msv-planner table.msv-spec tr th,
.msv-planner table.msv-spec tr td {
	background: transparent;
	background-color: transparent;
	font-size: 15px;
	font-weight: 400;
}
.msv-planner table.msv-spec tr th {
	color: var(--msv-navy);
	font-weight: 600;
	border-top: 0;
}
.msv-planner table.msv-spec tr td { color: #55666b; }
.msv-planner table.msv-spec,
.msv-planner table.msv-spec tr { border: 0; background: transparent; }

/* page-builder.css uppercases every title element. The approved copy is
   sentence case, and the editorial tone depends on it. */
.msv-hero .gdlr-core-title-item-title,
.msv-experience .gdlr-core-title-item-title,
.msv-behind .gdlr-core-title-item-title,
.msv-planner .gdlr-core-title-item-title,
.msv-inquire .gdlr-core-title-item-title,
.msv-kbyg .gdlr-core-title-item-title {
	text-transform: none;
}

/* The eyebrow above the H1 is the one place uppercase is intended. */
.msv-hero .gdlr-core-title-item-caption { text-transform: uppercase; }

/* Behind-the-scenes photograph: match the copy column's optical weight. */
.msv-behind .msv-behind-media .gdlr-core-pbf-column-content-margin { margin-bottom: 0; }
.msv-behind .msv-behind-media img { border-radius: 4px; display: block; }

/* Keep the two halves reading as a pair rather than drifting apart. */
@media only screen and (min-width: 1000px) {
	.msv-behind .msv-behind-copy .gdlr-core-pbf-column-content-margin { padding-left: 20px; }
}

/* ------------------------------------------------- benefit cards (4-up) -- */

/* Centred, a size up, and spaced apart — the element padding handles the
   horizontal gutter, this adds the vertical rhythm and holds the centring
   against the theme's left-aligned defaults. */
.msv-experience .gdlr-core-column-service-item { text-align: center; }
.msv-experience .gdlr-core-column-service-media { margin-bottom: 4px; }
.msv-experience .gdlr-core-column-service-title {
	color: var(--msv-navy);
	line-height: 1.35;
}
.msv-experience .gdlr-core-column-service-content { line-height: 1.75; }

/* The intro sits further from the cards than the cards do from each other. */
.msv-experience .msv-lead { margin-bottom: 10px; }

@media only screen and (max-width: 767px) {
	/* Stacked, the horizontal padding is wasted space. */
	.msv-experience .gdlr-core-column-service-item { padding-left: 0; padding-right: 0; }
}
