
/* ==========================================================================
   QuantumOrbit Consulting — Responsive
   Desktop-first overrides. Breakpoints: 1200 / 1024 / 860 / 640 / 420.
   ========================================================================== */

/* ---------- Sticky stacking cards (all screen sizes) ----------
   Each card sticks below the header and the next card slides over it.
   assets/js/main.js fine-tunes "top" per card so a card taller than the
   screen is scrolled fully into view before it sticks (no hidden content). */

.qo-has-stacking .stack__item {
	position: sticky;
	top: calc(16px + var(--i, 0) * 12px);
}

.qo-has-stacking.qo-sticky-header .stack__item {
	top: calc(var(--qo-header-h) + 16px + var(--i, 0) * 12px);
}

.qo-has-stacking.admin-bar.qo-sticky-header .stack__item {
	top: calc(var(--qo-header-h) + 48px + var(--i, 0) * 12px);
}


/* ---------- ≤1200 ---------- */

@media (max-width: 1200px) {
	.primary-nav__list a {
		padding-inline: 10px;
		font-size: 15px;
	}

	.decor-network--left::before,
	.decor-network--right::before {
		opacity: 0.6;
	}
}


/* ---------- ≤1024: tablet (mobile navigation starts here) ---------- */

@media (max-width: 1024px) {
	:root {
		--qo-header-h: 80px;
	}

	.site-logo--header img,
	.site-logo--header .custom-logo {
		height: 60px;
	}

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

	.site-header__menu {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		display: none;
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
		max-height: calc(100vh - var(--qo-header-h));
		max-height: calc(100dvh - var(--qo-header-h));
		overflow-y: auto;
		padding: 16px var(--qo-gutter) 28px;
		background: var(--qo-primary);
		border-top: 1px solid rgba(235, 237, 238, 0.08);
		box-shadow: 0 20px 30px rgba(0, 0, 0, 0.45);
	}

	.site-header.is-open .site-header__menu {
		display: flex;
	}

	.no-js .site-header__menu {
		position: static;
		display: flex;
		box-shadow: none;
	}

	.no-js .nav-toggle {
		display: none;
	}

	.primary-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
	}

	.primary-nav__list a {
		padding: 12px 16px;
		font-size: 17px;
		white-space: normal;
	}

	.primary-nav__list .sub-menu {
		position: static;
		min-width: 0;
		margin: 4px 0 0 16px;
		padding: 0;
		background: transparent;
		border: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.site-header__cta {
		align-self: flex-start;
	}

	/* Grids */
	.grid--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

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

	.card--icon {
		min-height: 260px;
	}

	.card--reveal {
		min-height: 280px;
	}

	/* Ways-to-begin tiles: one column with consistent bottom borders */
	.tile-grid--lines.tile-grid--3 {
		grid-template-columns: 1fr;
	}

	.tile-grid--lines.tile-grid--3 .tile,
	.tile-grid--lines.tile-grid--3 .tile:nth-child(2n),
	.tile-grid--lines.tile-grid--3 .tile:nth-child(2n+1):nth-last-child(-n+2),
	.tile-grid--lines.tile-grid--3 .tile:nth-child(2n+1):nth-last-child(-n+2) ~ .tile {
		border-right: 0;
		border-bottom: 1px solid #b5a48e;
	}

	.tile-grid--lines.tile-grid--3 .tile:last-child {
		border-bottom: 0;
	}

	.tile-grid--lines .tile {
		padding: 32px 20px 36px;
	}

	/* Strong fit */
	.fit {
		grid-template-columns: 1fr;
	}

	.fit__title {
		text-align: center;
	}

	/* Timeline → vertical */
	.timeline {
		grid-template-columns: 1fr;
		gap: 28px;
		max-width: 640px;
		margin-inline: auto;
		text-align: left;
	}

	.timeline::before {
		top: 0;
		bottom: 0;
		left: 39px;
		right: auto;
		width: 2px;
		height: auto;
	}

	.timeline__step {
		display: grid;
		grid-template-columns: 80px minmax(0, 1fr);
		column-gap: 24px;
	}

	.timeline__num {
		grid-row: span 2;
		width: 80px;
		height: 80px;
		margin: 0;
		font-size: 28px;
	}

	.timeline__title {
		align-self: end;
		margin: 8px 0 8px;
	}

	/* Founder */
	.founder__panel {
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 70px), calc(100% - 80px) 100%, 0 100%);
	}

	/* Footer */
	.site-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.site-footer__brand {
		grid-column: 1 / -1;
	}

	/* Contact */
	.contact-layout {
		grid-template-columns: 1fr;
	}

	.contact-card {
		clip-path: none;
	}
}


/* ---------- WordPress admin bar ---------- */

@media (max-width: 782px) {
	.admin-bar.qo-sticky-header .site-header {
		top: 46px;
	}
}

@media (max-width: 600px) {
	/* WP admin bar is not fixed on small screens */
	.admin-bar.qo-sticky-header .site-header {
		top: 0;
	}
}


/* ---------- Blog: sidebar moves below the article ---------- */

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

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

	.sidebar-box--cta {
		grid-column: 1 / -1;
	}
}


/* ---------- ≤860: large phones / small tablets ---------- */

@media (max-width: 860px) {
	/* Home hero stacks */
	.hero--home__grid {
		grid-template-columns: 1fr;
	}

	.hero--home .hero__media {
		max-width: 520px;
	}

	.hero--home .hero__media img {
		aspect-ratio: 4 / 3.4;
	}

	/* Two-column cards stack */
	.grid--2 {
		grid-template-columns: 1fr;
	}

	/* Advisory tiles */
	.tile-grid--2 {
		grid-template-columns: 1fr;
	}

	.tile-grid--boxed .tile:last-child:nth-child(odd) {
		grid-column: auto;
	}

	/* Questions */
	.q-grid {
		grid-template-columns: 1fr;
	}

	.q-grid__item,
	.q-grid__item:nth-child(odd) {
		border-right: 0;
		border-bottom: 1px solid #b5a48e;
	}

	.q-grid__item:nth-child(2n+1):nth-last-child(-n+2) {
		border-bottom: 1px solid #b5a48e;
	}

	.q-grid__item:last-child {
		border-bottom: 0;
	}

	.q-grid__label {
		margin-bottom: 10px;
	}

	/* Split cards: image on top */
	.split-card {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.split-card__media {
		order: -1;
	}

	.split-card__media img {
		aspect-ratio: 720 / 450;
		height: auto;
	}

	.card-num {
		margin-bottom: 20px;
	}

	.area-card {
		min-height: 0;
	}

	.area-card::before {
		background: linear-gradient(180deg, rgba(18, 22, 24, 0.82), rgba(18, 22, 24, 0.88));
	}

	.phase-card {
		min-height: 300px;
	}

	.phase-card::before {
		background: rgba(18, 22, 24, 0.55);
	}

	/* Founder: general responsive layout */
	.founder__grid {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.founder__photo {
		order: -1;
		width: min(100% - 2 * var(--qo-gutter), 460px);
		margin: 0 auto;
		clip-path: polygon(48px 0, 100% 0, 100% 100%, 0 100%, 0 48px);
	}

	.founder__panel {
		margin-top: -40px;
		padding: 72px var(--qo-gutter) 64px;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 48px), calc(100% - 56px) 100%, 0 100%);
	}

	/* About page: Jiten's photo above the text on tablet and mobile */
	.page-template-template-about .founder__grid {
		display: flex;
		flex-direction: column;
		gap: 0;
	}

	.page-template-template-about .founder__photo {
		order: -1;
		width: 100%;
		margin: 0 auto;
	}

	.page-template-template-about .founder__panel {
		order: 1;
		width: 100%;
		margin-top: 0;
	}

	.founder__content {
		max-width: 680px;
		margin-inline: auto;
	}

	/* Split intro stacks with a horizontal divider */
	.split-intro {
		grid-template-columns: 1fr;
	}

	.split-intro__title {
		padding: 0 0 24px;
	}

	.split-intro__text {
		padding: 24px 0 0;
		border-left: 0;
		border-top: 1px solid var(--qo-border);
	}

	/* Journey table → stacked rows */
	.journey__table thead {
		display: none;
	}

	.journey__table,
	.journey__table tbody,
	.journey__table tr,
	.journey__table td {
		display: block;
		width: 100%;
	}

	.journey__table tbody tr {
		padding: 16px 0;
	}

	.journey__table td {
		padding: 4px 0;
		text-align: left;
	}

	.journey__arrow {
		transform: rotate(90deg);
		width: 24px !important;
		text-align: center;
	}

	/* Strong fit */
	.fit__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.fit__item:last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}

	.cta-band {
		padding-top: clamp(100px, 18vw, 140px);
	}
}


/* ---------- ≤640: phones ---------- */

@media (max-width: 640px) {
	.post-sidebar,
	.post-navigation .nav-links {
		grid-template-columns: 1fr;
	}

	.post-navigation .nav-next {
		grid-column: auto;
		text-align: left;
	}

	.nav-links .page-numbers.prev,
	.nav-links .page-numbers.next {
		flex-basis: 100%;
		max-width: 160px;
	}

	:root {
		--qo-fs-lead: 18px; /* banner subtitle + section intros on phones */
	}

	.grid--4,
	.grid--3 {
		grid-template-columns: 1fr;
	}

	.card--icon {
		min-height: 0;
	}

	.card__bottom {
		padding-top: 24px;
	}

	.card--reveal {
		min-height: 0;
	}

	.card--reveal .card__title {
		margin: 0 0 16px;
	}

	/* Ways-to-begin tiles: keep one column and bottom borders only */
	.tile-grid--lines.tile-grid--3 {
		grid-template-columns: 1fr;
	}

	.tile-grid--lines.tile-grid--3 .tile,
	.tile-grid--lines.tile-grid--3 .tile:nth-child(2n+1):nth-last-child(-n+2) {
		border-right: 0;
		border-bottom: 1px solid #b5a48e;
	}

	.tile-grid--lines.tile-grid--3 .tile:last-child {
		border-bottom: 0;
	}

	.tile-grid--lines .tile__title {
		margin-bottom: 14px;
	}

	.fit__grid {
		grid-template-columns: 1fr;
	}

	.fit__item:last-child:nth-child(odd) {
		grid-column: auto;
	}

	.form-grid {
		grid-template-columns: 1fr;
	}

	.enquiry-form__footer .btn {
		width: 100%;
	}

	.site-footer__grid {
		grid-template-columns: 1fr;
	}

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

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

	.hero--banner {
		min-height: 0;
	}

	.hero--banner .hero__text br {
		display: none;
	}
}


/* ---------- ≤420: small phones ---------- */

@media (max-width: 420px) {
	.btn-group {
		flex-direction: column;
		align-items: stretch;
	}

	.hero--banner .btn-group,
	.cta-band .btn-group {
		align-items: center;
	}

	.site-logo--header img,
	.site-logo--header .custom-logo {
		height: 52px;
	}

	.footer-nav {
		grid-template-columns: 1fr;
	}
}

/* How We Work — force bottom borders on all tiles except the last */
@media (max-width: 1024px) {
    .page-template-template-how-we-work .tile-grid--lines.tile-grid--3 {
        grid-template-columns: 1fr;
    }

    .page-template-template-how-we-work .tile-grid--lines.tile-grid--3 > .tile {
        border-right: 0 !important;
        border-bottom: 1px solid #b5a48e !important;
    }

    .page-template-template-how-we-work .tile-grid--lines.tile-grid--3 > .tile:last-child {
        border-bottom: 0 !important;
    }
}


/* ==========================================================
   DEFINITIVE OVERRIDE: Homepage Jiten founder section
   Prevent the caption and next CTA section from overlapping
   ========================================================== */

@media (max-width: 860px) {

    /* Allow the complete founder section to determine its height */
    section.founder.founder--home {
        display: block !important;
        position: relative !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-bottom: 32px !important;
        margin-bottom: 0 !important;
        overflow: visible !important;
        clip-path: none !important;
        contain: none !important;
    }

    /* Stack photo and content in normal document flow */
    section.founder--home .founder__grid {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    /* Photo and caption must occupy their own space */
    section.founder--home .founder__photo {
        order: -1 !important;
        position: relative !important;
        flex: 0 0 auto !important;
        width: min(100% - 2 * var(--qo-gutter), 460px) !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 auto !important;
        padding: 0 !important;
        overflow: visible !important;
        clip-path: none !important;
        transform: none !important;
    }

    section.founder--home .founder__photo img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: contain !important;
    }

    section.founder--home .founder__caption {
        display: flex !important;
        flex-direction: column !important;
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 16px 0 24px !important;
        transform: none !important;
        overflow: visible !important;
        clip-path: none !important;
    }

    section.founder--home .founder__caption-name,
    section.founder--home .founder__caption-role {
        position: static !important;
        display: block !important;
        height: auto !important;
        max-height: none !important;
        line-height: 1.5 !important;
        white-space: normal !important;
        overflow: visible !important;
        transform: none !important;
    }

    /* Remove the negative overlap used by the general founder layout */
    section.founder--home .founder__panel {
        position: relative !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        overflow: visible !important;
        transform: none !important;
        clip-path: none !important;
    }

    section.founder--home .founder__content {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    /* Keep the following CTA after the entire founder section */
    section.founder--home + .cta-band {
        position: relative !important;
        inset: auto !important;
        height: auto !important;
        min-height: 0 !important;
        margin-top: 0 !important;
        transform: none !important;
        clear: both !important;
    }
}


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

@media print {
	.site-header,
	.site-footer,
	.cta-band,
	.nav-toggle {
		display: none !important;
	}

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