/*
Theme Name: Perth Dynamic Solutions Child
Template: hello-elementor
Version: 1.0
*/
    
:root {
    --navy: #2d4066;
    --navy-deep: #1d2c4a;
    --orange: #f3995a;
    --orange-deep: #dd7e2e;
    --leaf: #8bbf6c;
    --leaf-deep: #6a9650;
    --cream: #fdfaf3;
    --paper: #fffefb;
    --ink: #2a3344;
    --ink-soft: #69728a;
    --line: #ece5d4;
    --text-on-dark: #f7f3ea;
    --text-on-dark-soft: #dde1ec;
    --text-on-dark-faint: #b3bace;
    --navy-2: #1f3a57;
    --orange-dark: #c4632b;
    --leaf-dark: #55744a;
    --cream-2: #f4ecdd;
    --muted: #5b6b74;
    --white: #ffffff;
    --orange-accessible: #a04d1a;

    /* gradients */
    --grad-warm-soft: linear-gradient(180deg, #fdfaf3 0%, #fbf1e2 100%);
    --grad-orange-leaf: linear-gradient(135deg, #f3995a 0%, #8bbf6c 100%);
    --grad-navy-deep: linear-gradient(160deg, #2d4066 0%, #1d2c4a 100%);
    --grad-cream-glow: linear-gradient(180deg, #fffefb 0%, #fdf2e4 100%);
    --grad-orange-soft: linear-gradient(180deg, rgba(243,153,90,0.32) 0%, rgba(243,153,90,0.12) 55%, rgba(243,153,90,0) 100%);
    --grad-section-finance: linear-gradient(135deg, #f3995a 0%, #dd7e2e 100%);
    --grad-section-reviews: linear-gradient(175deg, #fffefb 0%, #fdfaf3 55%, #f8ecd8 100%);

    /* motion */
    --ease: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);

    /* shadows */
     --shadow-xs: 0 1px 3px rgba(13, 24, 48, 0.06);
    --shadow-sm:
          0 2px 10px rgba(13, 24, 48, 0.08), 0 1px 3px rgba(13, 24, 48, 0.05);
   --shadow-md:
          0 8px 28px -4px rgba(13, 24, 48, 0.13),
          0 2px 8px rgba(13, 24, 48, 0.06);
    --shadow-lg:
          0 24px 52px -12px rgba(13, 24, 48, 0.18),
          0 4px 14px rgba(13, 24, 48, 0.07);
     --shadow-xl:
          0 40px 80px -20px rgba(13, 24, 48, 0.22),
          0 8px 22px rgba(13, 24, 48, 0.08);
        --shadow-orange:
          0 8px 28px -6px rgba(217, 111, 18, 0.38),
          0 2px 8px rgba(217, 111, 18, 0.18);
        --shadow-navy: 0 8px 28px -6px rgba(29, 44, 74, 0.42);
    --shadow-glow-orange: 0 8px 20px -6px rgba(221,126,46,0.45);
    --shadow-glow-navy: 0 10px 24px -8px rgba(29,44,74,0.35);
    --font-display: 'Inter', serif;
        --font-body: 'Poppins', sans-serif;
        --navy-deeper: #131f38;
        --ink-faint: #9198b0;
        --line-soft: #f0ead9;
        --grad-cream: linear-gradient(180deg, #fffefc 0%, #faf6ec 100%);
        --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
        --radius-sm: 10px;
        --radius-md: 16px;
        --radius-lg: 22px;
        --radius-xl: 28px;
}

	* {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    a {
        text-decoration: none;
        
    }



    html {
        scroll-behavior: smooth;
    }

    body {
        margin: 0;
        background: var(--grad-cream-glow);
        background: var(--grad-warm-soft);
        color: var(--ink);
        font-family: "Inter", sans-serif;
        -webkit-font-smoothing: antialiased;
    }

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

    a {
        color: inherit;
        text-decoration: none;
    }

    .wrap {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }
    
    .breadcrumb{
        margin-top:156px;
    }
    
	[type=button]:focus, [type=button]:hover, [type=submit]:focus, [type=submit]:hover, button:focus, button:hover{
			background-color: none;
		}

	/* WordPress admin bar fix */
	.admin-bar header.site {
		top: 32px;
	}

	@media (max-width: 782px) {
		.admin-bar header.site {
			top: 46px;
		}
	}
	/*footer css*/
	.reveal {
		opacity: 0;
		transform: translateY(24px);
		transition: opacity 0.6s var(--ease-spring), transform 0.6s var(--ease-spring);
	}

	.reveal.is-visible {
		opacity: 1;
		transform: translateY(0);
	}

	.btn.ghost {
		background: transparent;
		color: var(--white);
		border: 1px solid var(--navy-deep);
		box-shadow: none;
	}

	btn.ghost:hover {
		background: var(--navy);

		box-shadow: var(--shadow-glow-navy);

	}


	/* REVIEWS */
	.reviews {
		padding-block: 50px;
		background: var(--grad-section-reviews);
	}

	/* a card that flies off the side must not make the page scroll sideways */
	#reviews {
		overflow-x: hidden; /* old browsers */
		overflow-x: clip;
	}

	.review-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	.review-card {
		border: 1px solid var(--line);
		border-radius: 16px;
		padding: 22px;
		background: #fff;
		/*display: flex;*/
		/*flex-direction: column;*/
		/*justify-content: space-between;*/
		box-shadow: var(--shadow-sm);
		transition:
			transform 0.4s var(--ease-spring),
			box-shadow 0.4s var(--ease);
	}
	.review-card a {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		height: stretch;
	}

	.review-card:hover {
		transform: translateY(-4px);
		box-shadow: var(--shadow-md);
	}

	.stars {
		color: var(--orange);
		font-size: 14px;
		margin-bottom: 10px;
	}

	.review-card p {
		font-size: 14px;
		color: var(--ink);
		line-height: 1.55;
		margin: 0 0 14px;
	}

	.reviewer {
		font-size: 13px;
		font-weight: 700;
		color: var(--navy);
		display: flex;
		justify-content: space-between;
	}

	.reviewer span {
		color: var(--ink-soft);
		font-weight: 500;
	}

	/* REVIEWS STACK: cards sit in a stack and shuffle.
	   footer.php script adds .is-stack. Without it (or with reduced motion) the normal grid stays. */
	#reviews .review-grid.is-stack {
		display: block;
		position: relative;
		max-width: 620px;
		margin: 0 auto;
		touch-action: pan-y; /* page scrolls up/down, left/right swipe goes to the script */
	}

	#reviews .review-grid.is-stack .review-card {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: auto;
		margin: 0;
		pointer-events: none; /* only the top card can be clicked */
		-webkit-user-select: none;
		user-select: none;
		transition:
			transform 0.6s var(--ease-spring),
			opacity 0.5s var(--ease),
			box-shadow 0.4s var(--ease);
	}

	/* top card */
	#reviews .review-grid.is-stack .review-card[data-pos="0"] {
		z-index: 3;
		opacity: 1;
		transform: none;
		pointer-events: auto;
		cursor: grab;
	}

	#reviews .review-grid.is-stack .review-card[data-pos="0"]:hover {
		transform: translateY(-4px);
	}

	/* while the finger or mouse drags the top card it follows 1:1, no easing */
	#reviews .review-grid.is-stack.is-dragging .review-card[data-pos="0"] {
		transition: none;
		cursor: grabbing;
	}

	/* second and third card show a little strip behind the top card, tilted a bit like a real pile */
	#reviews .review-grid.is-stack .review-card[data-pos="1"] {
		z-index: 2;
		opacity: 1;
		transform: translateY(12px) scale(0.96) rotate(0.8deg);
	}

	#reviews .review-grid.is-stack .review-card[data-pos="2"] {
		z-index: 1;
		opacity: 1;
		transform: translateY(24px) scale(0.92) rotate(-0.8deg);
	}

	/* all other cards wait hidden behind the stack */
	#reviews .review-grid.is-stack .review-card:not([data-pos="0"]):not([data-pos="1"]):not([data-pos="2"]) {
		z-index: 0;
		opacity: 0;
		transform: translateY(24px) scale(0.92);
	}

	/* short reviews: stars and text stay together at the top, name stays at the bottom */
	#reviews .review-grid.is-stack .review-card a {
		justify-content: flex-start;
	}

	#reviews .review-grid.is-stack .reviewer {
		margin-top: auto;
	}

	/* previous / next buttons under the stack */
	.review-nav {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 1rem;
		margin-top: 1.75rem;
	}

	.review-arrow {
		width: 40px;
		height: 40px;
		padding: 0;
		border-radius: 50%;
		border: 1px solid var(--line);
		background: var(--paper);
		color: var(--navy);
		font-size: 14px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		box-shadow: var(--shadow-xs);
		transition: background 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s var(--ease);
	}

	.review-arrow:focus {
		background: var(--paper);
		border-color: var(--line);
		color: var(--navy);
	}

	.review-arrow:hover {
		background: var(--orange);
		border-color: var(--orange);
		color: var(--white);
	}

	/* middle part of the nav: progress dots on top, "1 / 5" and pause button below */
	.review-mid {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 2px;
	}

	.review-dots {
		display: flex;
		align-items: center;
	}

	/* the button is a bigger tap area, the small bar inside is what you see */
	.review-nav button.review-dot,
	.review-nav button.review-dot:hover,
	.review-nav button.review-dot:focus {
		display: flex;
		align-items: center;
		justify-content: center;
		min-width: 24px;
		height: 24px;
		padding: 0 4px;
		border: 0;
		border-radius: 0;
		background: transparent;
		cursor: pointer;
	}

	.review-nav button.review-dot:focus-visible {
		outline: 2px solid var(--navy);
		outline-offset: -2px;
		border-radius: 6px;
	}

	.review-dot-bar {
		position: relative;
		display: block;
		width: 8px;
		height: 8px;
		border-radius: 99px;
		background: #d9ceb6;
		overflow: hidden;
		transition: width 0.45s var(--ease-spring), background-color 0.3s var(--ease);
	}

	.review-dot:hover .review-dot-bar {
		background: #c4b690;
	}

	.review-dot.is-active .review-dot-bar {
		width: 30px;
	}

	/* orange fill = time left for this review. script sets transform: scaleX(0..1) */
	.review-dot-fill {
		position: absolute;
		inset: 0;
		display: block;
		background: var(--orange);
		transform: scaleX(0);
		transform-origin: left center;
	}

	.review-meta {
		display: flex;
		align-items: center;
		gap: 4px;
	}

	.review-count {
		font-size: 12px;
		font-weight: 600;
		letter-spacing: 0.06em;
		color: var(--ink-soft);
		font-variant-numeric: tabular-nums;
	}

	.review-nav button.review-pause,
	.review-nav button.review-pause:focus {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 26px;
		height: 26px;
		min-width: 0;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: transparent;
		color: var(--ink-soft);
		font-size: 10px;
		cursor: pointer;
		transition: background-color 0.2s var(--ease), color 0.2s var(--ease);
	}

	.review-nav button.review-pause:hover {
		background: rgba(45, 64, 102, 0.1);
		color: var(--navy);
	}

	.review-nav button.review-pause:focus-visible {
		outline: 2px solid var(--navy);
		outline-offset: 1px;
	}

	/* top card intro: stars pop one by one, then text and name rise.
	   Starts when the card comes to the top. .is-live is added by the script when the section is first seen. */
	#reviews .review-grid.is-stack .stars span {
		display: inline-block;
	}

	#reviews .review-grid.is-stack:not(.is-live) .review-card[data-pos="0"] .stars span,
	#reviews .review-grid.is-stack:not(.is-live) .review-card[data-pos="0"] p,
	#reviews .review-grid.is-stack:not(.is-live) .review-card[data-pos="0"] .reviewer {
		opacity: 0;
	}

	#reviews .review-grid.is-live .review-card[data-pos="0"] .stars span {
		animation: reviewStar 0.5s var(--ease-spring) both;
		animation-delay: calc(0.15s + var(--i, 0) * 0.07s);
	}

	#reviews .review-grid.is-live .review-card[data-pos="0"] p {
		animation: reviewRise 0.55s var(--ease-spring) 0.3s both;
	}

	#reviews .review-grid.is-live .review-card[data-pos="0"] .reviewer {
		animation: reviewRise 0.55s var(--ease-spring) 0.42s both;
	}

	@keyframes reviewStar {
		from {
			opacity: 0;
			transform: scale(0.2) rotate(-40deg);
		}
		to {
			opacity: 1;
			transform: none;
		}
	}

	@keyframes reviewRise {
		from {
			opacity: 0;
			transform: translateY(10px);
		}
		to {
			opacity: 1;
			transform: none;
		}
	}



	.sec-eyebrow {
		font-size: 12.5px;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--orange-deep);
		margin-bottom: 10px;
	}

	h2.sec-h {
		font-family: "Poppins", serif;
		font-weight: 600;
		font-size: clamp(26px, 3.4vw, 38px);
		color: var(--navy-deep);
		line-height: 1.12;
		margin: 0 0 14px;
	}

	.sec-sub {
		color: var(--ink-soft);
		font-size: 16px;
		line-height: 1.6;
	}

	.sec-sub h2 {
		color: #c9cfdc;
		margin: 0 auto 30px;
		max-width: 520px;
	}

	.final-ctas {
		display: flex;
		gap: 14px;
		justify-content: center;
	}



	/* CTA — blueprint panel */
	.foot-contact {
		padding-block: 60px;
	}

	.cta-blueprint {
		position: relative;
		background: var(--navy-deep);
		border-radius: 4px;
		padding: 56px 48px;
		overflow: hidden;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0 100%);
	}

	.cta-blueprint::before {
		content: "";
		position: absolute;
		top: -60%;
		right: -10%;
		width: 260px;
		height: 260%;
		background: var(--orange);
		opacity: 0.08;
		transform: rotate(18deg);
		pointer-events: none;
	}

	.blueprint-corner {
		position: absolute;
		width: 16px;
		height: 16px;
		z-index: 2;
	}

	.blueprint-corner::before,
	.blueprint-corner::after {
		content: "";
		position: absolute;
		background: var(--orange);
		opacity: 0.6;
	}

	.blueprint-corner::before {
		top: 50%;
		left: 0;
		width: 100%;
		height: 1.5px;
		transform: translateY(-50%);
	}

	.blueprint-corner::after {
		left: 50%;
		top: 0;
		width: 1.5px;
		height: 100%;
		transform: translateX(-50%);
	}

	.blueprint-corner.tl {
		top: 18px;
		left: 18px;
	}

	.blueprint-corner.tr {
		top: 18px;
		right: 18px;
	}

	.blueprint-corner.bl {
		bottom: 18px;
		left: 18px;
	}

	.blueprint-corner.br {
		bottom: 18px;
		right: 18px;
	}

	.cta-blueprint-inner {
		position: relative;
		z-index: 1;
		display: grid;
		grid-template-columns: 1.4fr auto 1fr;
		gap: 40px;
		align-items: center;
	}

	.cta-blueprint-copy .eyebrow-mono {
		font-family: "Poppins";
		letter-spacing: 0.14em;
	}

	.cta-blueprint-copy .sec-h,
	.cta-blueprint-copy .sec-sub {
		color: #fff;
	}

	.cta-blueprint-copy .sec-sub {
		opacity: 0.75;
		max-width: 480px;
	}

	.cta-blueprint .final-ctas {
		justify-content: flex-start;
		margin-top: 24px;
	}

	.cta-blueprint .btn.ghost {
		border-color: rgba(255, 255, 255, 0.35);
		color: #fff;
	}

	.cta-blueprint .btn.ghost:hover {
		background: #fff;
		color: var(--navy-deep);
	}

	.cta-blueprint-divider {
		width: 1px;
		height: 100%;
		background-image: linear-gradient(var(--orange) 50%, transparent 0%);
		background-size: 1px 8px;
		background-repeat: repeat-y;
		opacity: 0.4;
	}

	.cta-specs {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: 14px;
	}

	.cta-specs li {
		display: flex;
		justify-content: space-between;
		gap: 16px;
		font-size: 12.5px;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: rgba(255, 255, 255, 0.5);
		border-bottom: 1px dashed rgba(255, 255, 255, 0.15);
		padding-bottom: 10px;
	}

	.cta-specs li span:last-child {
		color: #fff;
		font-weight: 700;
		letter-spacing: 0;
		text-transform: none;
	}
	/* Credentials — minimal ledger strip */

	/* Credentials strip */
	.foot-credentials-wrap {
		padding-block: 32px;
	}

	.foot-credentials {
		list-style: none;
		margin: 0;
		padding: 0;
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 12px;
	}

	.foot-credentials li {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
		text-align: center;
		padding: 16px 10px;
		border-radius: 12px;
		background: #fff;
		border: 1px solid var(--line);
		box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
		transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	}

	.foot-credentials li:hover {
		transform: translateY(-3px);
		box-shadow: 0 12px 24px -8px rgba(16, 24, 40, 0.12), 0 4px 8px -2px rgba(16, 24, 40, 0.06);
	}

	.foot-credentials img {
		object-fit: contain;
	}


	/* ============================================
	   FOOTER — Bento Blueprint Layout (NEW)
	   ============================================ */

	.footer {
		position: relative;
		background: var(--grad-orange-soft);
		padding: 80px 0 32px;
		color: var(--ink);
		border-radius: 24px 24px 0 0;
		overflow: hidden;
	}

	.footer .blueprint-corner {
		position: absolute;
		width: 16px;
		height: 16px;
		z-index: 2;
		opacity: 0.5;
	}

	.footer .blueprint-corner::before,
	.footer .blueprint-corner::after {
		content: "";
		position: absolute;
		background: var(--orange);
		opacity: 0.6;
	}

	.footer .blueprint-corner::before {
		top: 50%;
		left: 0;
		width: 100%;
		height: 1.5px;
		transform: translateY(-50%);
	}

	.footer .blueprint-corner::after {
		left: 50%;
		top: 0;
		width: 1.5px;
		height: 100%;
		transform: translateX(-50%);
	}

	.footer .blueprint-corner.tl {
		top: 24px;
		left: 24px;
	}

	.footer .blueprint-corner.tr {
		top: 24px;
		right: 24px;
	}

	.footer-grid {
		display: grid;
		grid-template-columns: 1.5fr 1fr 1fr 1.1fr;
		gap: 0;
		margin-bottom: 56px;
	}

	.footer-brand,
	.footer-col,
	.footer-touch {
		padding: 0 36px;
	}

	.footer-brand {
		padding-left: 0;
	}

	.foot-brand {
		display: flex;
		align-items: center;
		gap: 10px;
		margin-bottom: 16px;
	}

	.foot-brand img {
		height: 34px;
		width: 34px;
		border-radius: 8px;
	}

	.foot-brand span {
		font-family: "Poppins", serif;
		color: var(--navy-deep);
		font-weight: 600;
		font-size: 14px;
		letter-spacing: 0.02em;
	}

	.footer-brand p {
		font-size: 13.5px;
		line-height: 1.7;
		color: var(--orange-deep);
		max-width: 300px;
		margin: 0 0 18px;
	}

	/* Social icons — Font Awesome */
	.footer-social {
		display: flex;
		gap: 10px;
		list-style: none;
		padding: 0;
		margin: 0 0 18px;
	}

	.footer-social a {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		border-radius: 50%;
		border: 1px solid rgba(9, 20, 45, 0.18);
		color: var(--navy-deep);
		font-size: 14px;
		transition: background 0.3s var(--ease), border-color 0.3s var(--ease), color 0.3s var(--ease), transform 0.3s var(--ease-spring);
	}

	.footer-social a:hover {
		background: var(--orange);
		border-color: var(--orange);
		color: #fff;
		transform: translateY(-3px);
	}

	.footer-social a:focus-visible {
		outline: 2px solid var(--navy-deep);
		outline-offset: 3px;
	}

	.foot-brand-tag {
		font-family: "Poppins";
		font-size: 11px;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--navy-deep);
		opacity: 0.55;
	}

	.foot-col-label {
		display: block;
		font-family: "Poppins";
		font-size: 13px;
		font-weight: 600;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--orange-deep);
		margin-bottom: 16px;
	}

	.footer-col ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: flex;
		flex-direction: column;
		gap: 11px;
		font-size: 13.5px;
	}

	.footer-col ul li a {
		color: var(--navy-deep);
		position: relative;
		display: inline-flex;
		align-items: center;
		gap: 6px;
		transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1), gap 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		  padding: 6px 0;
	  line-height: 1.4;
	}
	.footer-col ul li {
	  margin-bottom: 4px;
	}

	/*.footer-col ul li a {*/
	/*  display: inline-block;*/

	/*}*/

	.footer-col ul li a::before {
		content: "›";
		color: var(--orange);
		opacity: 0;
		transform: translateX(-4px);
		transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	}

	.footer-col ul li a:hover {
		color: var(--orange-deep);
		gap: 8px;
	}

	.footer-col ul li a:hover::before {
		opacity: 1;
		transform: translateX(0);
	}

	.footer-col ul li a:focus-visible {
		outline: 2px solid var(--navy-deep);
		outline-offset: 3px;
		border-radius: 2px;
	}

	.footer-touch {
		display: flex;
		flex-direction: column;
	}

	.footer-touch-link {
		color: var(--navy-deep);
		font-size: 13.5px;
		font-weight: 600;
		margin-bottom: 10px;
		word-break: break-word;
		display: flex;
		align-items: center;
		gap: 8px;
		transition: color 0.3s var(--ease);
	}

	.footer-touch-link i {
		color: var(--orange);
		font-size: 13px;
		width: 16px;
		text-align: center;
	}

	.footer-touch-link:hover {
		color: var(--orange-deep);
	}

	.foot-bottom {
		padding-top: 22px!important;
		display: flex;
		justify-content: space-between;
		font-size: 12px;
		letter-spacing: 0.02em;
		color: var(--ink-soft);
	}

	.reveal {
		opacity: 0;
		transform: translateY(26px);
		transition: opacity 0.7s var(--ease-spring), transform 0.7s var(--ease-spring);
		will-change: opacity, transform;
	}

	.reveal.is-visible {
		opacity: 1;
		transform: translateY(0);
	}
	.foot-bottom .site-credit {
      color: inherit;
      text-decoration: none;
      opacity: .8;
      transition: opacity .2s ease;
    }
    .foot-bottom .site-credit:hover {
      opacity: 1;
      text-decoration: underline;
    }
    .foot-bottom .credit-sep {
      margin: 0 4px;
      opacity: .6;
    }
    @media (max-width: 600px) {
      .foot-bottom > span {
        display: block;
        text-align: center;
      }
    }

	@media (prefers-reduced-motion: reduce) {
		* {
			transition-duration: 0.01ms !important;
			animation-duration: 0.01ms !important;
		}
	}

	@media (max-width: 992px) {
		.review-grid {
			grid-template-columns: repeat(2, 1fr);
		}

		.review-grid>*:last-child {
			grid-column: 1 / -1;
			width: calc(50% - 11px);
			margin: 0 auto;
		}
	}

	@media (max-width: 768px) {
		.cta-blueprint-inner {
			grid-template-columns: 1fr;
		}
		.foot-credentials {
			grid-template-columns: repeat(3, 1fr);
		}

		.cta-blueprint-divider {
			display: none;
		}

		.cta-specs {
			flex-direction: row;
			flex-wrap: wrap;
			gap: 10px 24px;
		}

		.cta-specs li {
			flex: 1 1 45%;
			border-bottom: none;
			padding-bottom: 0;
		}

		.cta-blueprint .final-ctas {
			justify-content: center;
		}

		.cta-blueprint-copy {
			text-align: center;
		}

		.cta-blueprint-copy .sec-sub {
			margin-inline: auto;
		}

		.foot-credentials {
			justify-content: flex-start;
		}

		.foot-credentials li {
			padding: 0 18px;
		}
		.foot-credentials img {
			object-fit: contain;
			height: 90px;
		}
	}

	@media (max-width: 560px) {
		.foot-credentials {
			grid-template-columns: repeat(2, 1fr);
		}
		.foot-credentials img {
			height: 85px;
		}
		.final-ctas {
			flex-direction: column;
			align-items: center;
		}

		.review-grid {
			grid-template-columns: repeat(1, 1fr);
		}

		.review-grid>*:last-child {
			width: inherit;
			grid-column: inherit;
			margin: inherit;
		}

		.cta-blueprint {
			padding: 40px 24px;
			clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%);
		}

		.blueprint-corner {
			display: none;
		}

		.cta-specs {
			flex-direction: column;
		}

		.cta-specs li {
			flex: none;
		}

		.foot-credentials {
			gap: 14px;
		}

		.foot-credentials li {
			padding: 0;
		}
	}

	/* ============================================
	   FOOTER RESPONSIVE — 1200 / 1024 / 992 / 768 / 540 (NEW)
	   ============================================ */

	@media (max-width: 1200px) {
		.footer-grid {
			grid-template-columns: 1.3fr 1fr 1fr 1fr;
		}
	}

	@media (max-width: 1024px) {
		.footer-grid {
			grid-template-columns: 1.2fr 1fr 1fr;
		}

		.footer-touch {
			grid-column: 1 / -1;
			padding-left: 0;
			flex-direction: row;
			gap: 32px;
			padding-top: 24px;
			margin-top: 8px;
		}

		.footer-touch .foot-col-label {
			display: none;
		}
	}

	@media (max-width: 992px) {
		.footer {
			padding: 60px 0 24px;
			border-radius: 22px 22px 0 0;
		}

		.footer-grid {
			grid-template-columns: 1fr 1fr;
			row-gap: 32px;
		}

		.footer-brand {
			grid-column: 1 / -1;
			padding: 0;
		}

		.footer-touch {
			align-items: center;
			justify-content: center;
		}
		.footer-brand, .footer-col{
			display: flex;
			flex-direction: column;
			align-items: center;
			}
	}

	@media (max-width: 768px) {
		.footer-grid {
			column-gap: 20px;
			row-gap: 20px;
		}

		.footer-col,
		.footer-touch {
			padding: 0;
		}

		.footer-touch {
			flex-direction: column;
			padding-top: 0;
		}

		.footer-touch .foot-col-label {
			display: block;
		}

		.footer .blueprint-corner {
			display: none;
		}

		.footer-touch{
				gap:0;
			}
	}

	@media (max-width: 540px) {

		.footer {
			padding: 48px 0 20px;
		}

		.foot-brand-tag {
			font-size: 10px;
		}

		.footer-brand p {
			max-width: none;
		}

		.foot-bottom {
			flex-direction: column;
			gap: 8px;
			text-align: center;
		}

		.footer-social a {
			width: 34px;
			height: 34px;
			font-size: 13px;
		}

	}