/**
 * Responsive fixes for layout bugs inherited from the original GHL sections.
 * Loaded after every bundle; selectors mirror the generated bundle selectors so source order decides.
 */

/* Clip content pushed sideways by entrance animations (GHL clips this in its root wrapper). */
#page {
	overflow-x: clip;
}

/* Home hero: the claims row under the buttons was removed, so the fixed 90vh height left a large empty band.
   The hero now fits its content: space under the buttons matches the space above (130px, 100px up to 1024px).
   Bottom padding = that space + the next section's card overlap (60px, 30px up to 991px)
   - the 40px grid gap of the empty image column once the hero is a single column (up to 1024px). */
:root:root:root .psi-ghl-block-IMmx5lvjSx .hero-section {
	min-height: 0;
	padding-bottom: 190px;
}

:root:root:root .psi-ghl-block-IMmx5lvjSx .cta-group {
	margin-bottom: 0;
}

@media (max-width: 1024px) {
	:root:root:root .psi-ghl-block-IMmx5lvjSx .hero-section {
		padding-bottom: 120px;
	}
}

@media (max-width: 991px) {
	:root:root:root .psi-ghl-block-IMmx5lvjSx .hero-section {
		padding-bottom: 90px;
	}
}

/* Home hero: the single mobile column must not grow to fit the no-wrap rating line (cut off below ~330px). */
@media (max-width: 480px) {
	:root:root:root .psi-ghl-block-IMmx5lvjSx .hero-container {
		grid-template-columns: minmax(0, 1fr);
	}

	:root:root:root .psi-ghl-block-IMmx5lvjSx .rating-info :where(strong, [data-psi-tag="strong"]):not(psi-x) {
		white-space: normal;
	}

	:root:root:root .psi-ghl-block-IMmx5lvjSx .rating-info {
		flex-shrink: 1;
		min-width: 0;
	}

	/* Keep "No surprises. Just results." as centred lines instead of two squeezed columns. */
	:root:root:root .psi-ghl-block-IMmx5lvjSx .hero-subtitle {
		flex-wrap: wrap;
		column-gap: 6px;
		row-gap: 0;
	}
}

/* Home hero on small phones: section and container both add a 20px gutter; keep only the section's. */
@media (max-width: 380px) {
	:root:root:root .psi-ghl-block-IMmx5lvjSx .hero-container {
		padding-left: 0;
		padding-right: 0;
	}
}

/* Residential header: between the mobile layout and ~1250px the menu wrapped onto 2–4 rows.
   Tablets and small laptops (769–1099px) get the original mobile header (hamburger menu); the header script is width-independent. */
@media (min-width: 769px) and (max-width: 1099px) {
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-container {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		padding: 15px 15px 0 15px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-mobile-header-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-logo-wrap,
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-block,
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-actions,
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-tagline {
		grid-column: auto;
		grid-row: auto;
		width: 100%;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-logo-img {
		height: 40px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-tagline {
		font-size: 14px;
		line-height: 20px;
		margin-top: 2px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-menu-trigger {
		display: block;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-block {
		margin-top: 10px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu {
		display: none;
		flex-direction: column;
		width: 100%;
		gap: 10px;
		flex-wrap: wrap;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu a {
		font-size: 18px;
		line-height: 24px;
		white-space: normal;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu > :where(li, [data-psi-tag="li"]):not(psi-x) > a::after {
		display: none;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu.active {
		display: flex;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-dropdown-list {
		position: static;
		display: none;
		box-shadow: none;
		padding-left: 15px;
		background-color: #222E42;
		border-radius: 4px;
		margin-top: 5px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu :where(li, [data-psi-tag="li"]):not(psi-x).open > .custom-dropdown-list {
		display: block;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-actions {
		display: none;
		flex-direction: column;
		gap: 10px;
		margin-top: 15px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-actions.mobile-visible {
		display: flex;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-btn-call,
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-btn-action {
		justify-content: center;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
	}
}

/* Residential header, small laptops: the medium-screen sizing the commercial header already uses, menu on one row. */
@media (min-width: 1100px) and (max-width: 1249px) {
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-header-container {
		padding: 0 20px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu {
		gap: 12px;
		flex-wrap: nowrap;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-nav-menu a {
		font-size: 13px;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-btn-call,
	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-btn-action {
		padding: 9px 14px;
		font-size: 12px;
		flex-shrink: 0;
	}

	:root:root:root .psi-ghl-block-TSV5TD2vzG .custom-logo-img {
		height: 60px;
	}
}

/* Commercial header: the menu overlapped the buttons up to ~1045px (and was cramped until ~1100px); use the original mobile header there too. */
@media (min-width: 769px) and (max-width: 1099px) {
	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-header-container {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 10px;
		padding: 15px;
		min-height: auto;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-mobile-header-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-logo-img {
		height: 45px;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-menu-trigger {
		display: block;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-block {
		width: 100%;
		padding: 0;
		justify-content: flex-start;
		order: 2;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu {
		display: none;
		flex-direction: column;
		width: 100%;
		gap: 0;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu > :where(li, [data-psi-tag="li"]):not(psi-x) {
		border-bottom: 1px solid rgba(255,255,255,0.06);
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-item {
		width: 100%;
		justify-content: space-between;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu a {
		font-size: 16px;
		line-height: 22px;
		white-space: normal;
		padding: 12px 0;
		flex: 1;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .dropdown-toggle {
		font-size: 16px;
		padding: 12px 14px;
		margin: 0;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu > :where(li, [data-psi-tag="li"]):not(psi-x) > .custom-nav-item > a::after {
		display: none;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu.active {
		display: flex;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-dropdown-list {
		position: static;
		display: none;
		box-shadow: none;
		padding-left: 0;
		background-color: #1a2538;
		border-radius: 0;
		margin-top: 0;
		min-width: 100%;
		opacity: 1;
		transform: none;
		transition: none;
		border-top: 1px solid rgba(255,255,255,0.06);
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-dropdown-list a {
		padding: 12px 20px;
		font-size: 15px;
		white-space: normal;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu :where(li, [data-psi-tag="li"]):not(psi-x).open > .custom-dropdown-list {
		display: block;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu :where(li, [data-psi-tag="li"]):not(psi-x):hover > .custom-dropdown-list {
		display: none;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-nav-menu :where(li, [data-psi-tag="li"]):not(psi-x).open:hover > .custom-dropdown-list {
		display: block;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-header-actions {
		display: none;
		flex-direction: column;
		gap: 10px;
		width: 100%;
		order: 3;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-header-actions.mobile-visible {
		display: flex;
	}

	:root:root:root .psi-ghl-block-GAedeRx6P_ .custom-btn-call,
	:root:root .custom-btn-action {
		justify-content: center;
		text-align: center;
		width: 100%;
		box-sizing: border-box;
		font-size: 14px;
		padding: 12px;
	}
}


/* Footer email: the narrow contact column on small laptops split the address mid-word ("info@psiguystx.co / m"). */
@media (min-width: 1024px) and (max-width: 1199px) {
	:root:root:root .psi-ghl-block-xB0OrX6rQx .psi-contact-item .break-all {
		font-size: 14px;
		word-break: normal;
		overflow-wrap: normal;
		white-space: nowrap;
	}
}

/* Home "Why Choose" rows: the -20px bleed is wider than the 16px mobile gutter. */
@media (max-width: 767px) {
	:root:root:root .psi-ghl-block-Tnrt5B_Cy4 .feat-row {
		margin-left: -16px;
		margin-right: -16px;
		padding-left: 16px;
		padding-right: 16px;
	}
}

/* Home services: the first card image lacks the psiServ-card-img class in the source, so it stopped at its natural width. */
:root:root:root .psi-ghl-block-Jwo5QqpEop .psiServ-card-img-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

:root:root:root .psi-ghl-block-Jwo5QqpEop .psiServ-card:hover .psiServ-card-img-wrapper img {
	transform: scale(1.1);
}

/* Commercial hero: the original mobile rules only cover 360–740px, leaving smaller phones and 741–767px on the desktop layout. */
@media (max-width: 359px), (min-width: 741px) and (max-width: 767px) {
	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-content {
		width: 100%;
		max-width: 100%;
		padding: 40px 24px;
		justify-content: center;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-scrim {
		background:
			linear-gradient(0deg, rgba(8, 27, 51, .95) 45%, rgba(8, 27, 51, .4) 75%, rgba(8, 27, 51, .2) 100%),
			linear-gradient(90deg, rgba(8, 27, 51, .7) 0%, rgba(8, 27, 51, .3) 100%);
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-bgImage img {
		object-position: center;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-eyebrow {
		font-size: 16px;
		font-weight: 600;
		letter-spacing: .15em;
		margin-bottom: 16px;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k :where(h1, [data-psi-tag="h1"]):not(psi-x) {
		font-size: 24px;
		font-weight: 600;
		line-height: 1.25;
		margin-bottom: 14px;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-subhead {
		font-size: 14px;
		font-weight: 400;
		line-height: 1.6;
		max-width: 100%;
		margin-bottom: 24px;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-ctaRow {
		flex-direction: column;
		width: 100%;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-cta,
	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-ctaSecondary {
		width: 100%;
		justify-content: center;
		padding: 14px;
		font-size: 14px;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-trust {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-trust :where(li, [data-psi-tag="li"]):not(psi-x) {
		font-size: 12px;
	}
}

/* Gutter page: photo next to the inclusion list (audit). It fills the row on desktop and keeps a height when stacked. */
:root:root:root .psi-ghl-block-GOd2z1wDxV .psi-gutter-photo {
	min-height: 16rem;
}

/*
 * Wide screens: hero text lines up with the header content (logo edge) instead of hugging the left edge.
 * The residential header content is 1450px wide and the commercial header 1490px, both centered; each hero keeps
 * its own padding whenever that is larger, so nothing changes below 1600px.
 */
@media (min-width: 1600px) {
	/* Service page heroes: padding on the section itself. */
	:root:root:root .psi-ghl-block-oULy1Ly2Ty .psi-hero-section,
	:root:root:root .psi-ghl-block-61am-Qldm1 .psi-hero-section,
	:root:root:root .psi-ghl-block-Hh_nfqLd8T .psi-hero-section,
	:root:root:root .psi-ghl-block-fU-fcdc-HM .psi-hero-section {
		padding-left: max(96px, calc((100% - 1450px) / 2));
	}

	:root:root:root .psi-ghl-block-GJXT2d_2ca .psi-hero-section,
	:root:root:root .psi-ghl-block-kXKzq4Ipo8 .psi-hero-section,
	:root:root:root .psi-ghl-block-_8TMkE8f5a .psi-hero-section,
	:root:root:root .psi-ghl-block-PZ7r8drcKo .psi-hero-section {
		padding-left: max(96px, calc((100% - 1490px) / 2));
	}

	/* Residential window hero: padding sits on the content box inside the section. */
	:root:root:root .psi-ghl-block-D6y1KVHrRp .psi-hero-section > .max-w-4xl {
		margin-left: max(0px, calc((100% - 1450px) / 2 - 96px));
	}

	/* Commercial services hero. */
	:root:root:root .psi-ghl-block-5rBTVSpWvm .psiComHeroX9k-content {
		padding-left: max(60px, calc((100% - 1490px) / 2));
	}

	/* Residential services hero. */
	:root:root:root .psi-ghl-block-Xz9IS_fLPM .hero > .content {
		margin-left: max(0px, calc((100% - 1450px) / 2 - 160px));
	}

	/* Commercial window split section: the text half lines up with the header (its padding is a share of its half). */
	:root:root:root .psi-ghl-block-FBDBCBNpeH .psi-feature-section-v2 .grid > :first-child {
		padding-left: max(64px, calc(100% - 745px));
	}
}
