/* Responsive rules */

@media(max-width:700px) {
	.nl-feature-row {
		flex-direction: column;
		gap: 0.85rem;
	}

	.nl-feat-item {
		min-width: unset;
	}
}

@media(max-width:960px) {
	.problem-cards {
		grid-template-columns: 1fr;
		gap: 1rem;
	}
}

@media(max-width:600px) {
	#problem {
		padding: 4rem 1.2rem;
	}

	.problem-card {
		padding: 1.5rem;
	}

	.problem-cta-bar {
		flex-direction: column;
		text-align: center;
		gap: 0.6rem;
	}
}

@media(max-width:960px) {

	.container,
	.container-fluid {
		padding-left: 20px;
		padding-right: 20px;
	}

	.mobile-menu-btn {
		display: flex;
	}

	nav {
		height: 72px;
		padding: 0 1rem;
	}

	.nav-shell,
	.nav-row {
		height: 100%;
	}

	.nav-left,
	.nav-right {
		display: none !important;
	}

	.nav-brand {
		display: none;
		opacity: 0;
		pointer-events: none;
	}

	.nav-top-brand {
		display: none;
	}

	nav.nav-at-top {
		background: transparent;
		backdrop-filter: blur(0);
		border-bottom-color: transparent;
	}

	nav.nav-scrolled {
		height: 72px;
		background: rgba(255, 255, 255, .94);
		backdrop-filter: blur(14px);
		border-bottom-color: #dce5df;
	}

	nav.nav-at-top .mobile-menu-btn {
		color: white;
	}

	nav.nav-scrolled .mobile-menu-btn {
		color: var(--accent);
	}

	/* Hero */
	.hero-content-wrap {
		padding: clamp(6rem, 12vh, 7.5rem) 0 2.5rem;
		width: 100%;
		overflow: hidden;
		transform: none;
	}

	.hero-problems {
		grid-template-columns: 1fr;
		max-width: 100%;
		margin-left: 0;
	}

	.hero-feature-slider {
		max-width: 100%;
		min-height: 0;
		height: auto;
		margin: 0;
	}

	.hero-slider-col {
		justify-content: center;
		padding-top: 1.5rem;
	}

	.hero-feature-card {
		min-height: 0;
	}

	.hero-actions {
		align-items: flex-start;
	}

	/* Sections */
	.community-intro {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.pricing-three {
		max-width: 100%;
	}

	.p-card.pro {
		transform: none;
	}

	.materials-grid {
		max-width: none;
		margin-left: 0;
	}

	/* Avatar */
	.avatar-preview-row {
		grid-template-columns: 1fr;
	}

	.avatar-skins-mini {
		flex-direction: row;
		gap: 0.5rem;
	}

	.skin-mini-card {
		flex: 1;
	}
}

@media(max-width:600px) {

	/* Nav */
	nav {
		height: 72px;
		padding: 0 1rem;
	}

	.nav-shell,
	.nav-row {
		height: 72px;
	}

	.mobile-menu-btn {
		position: relative;
		z-index: 420;
		width: 40px;
		height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.mobile-menu-btn.open {
		color: var(--accent);
	}

	.mobile-drawer {
		padding-top: 220px;
	}

	.drawer-logo {
		top: 60px;
	}

	.mobile-drawer a {
		font-size: 1.35rem;
	}

	/* Sections: reduce padding */
	section {
		padding: 72px 0;
	}

	/* Hero */
	#home {
		padding: 72px 0 0;
		overflow: hidden;
	}

	.hero-content-wrap {
		padding: 2.5rem 0 2.5rem;
		width: 100%;
		max-width: 100%;
		overflow: hidden;
		transform: none;
	}

	.hero-text,
	.hero-desc,
	.hero-problems,
	.hero-problem-grid,
	.hero-problem-item,
	.hero-problem-item>div,
	.hero-actions {
		width: 100%;
		max-width: 100%;
		min-width: 0;
	}

	.hero-desc,
	.hpi-text {
		overflow-wrap: anywhere;
	}

	h1 {
		font-size: 3rem;
		line-height: .96;
	}

	.hero-desc {
		font-size: 1rem;
	}

	.hero-problems {
		max-width: 100%;
	}

	.hero-problem-item {
		min-height: auto;
		padding: 22px;
	}

	.hero-feature-card {
		height: 100%;
		min-height: 0;
		grid-template-rows: 1fr;
	}

	.hero-feature-slider {
		min-height: 0;
		height: auto;
		padding: 22px;
	}

	.hero-feature-slider .carousel-inner {
		height: auto;
		min-height: 0;
	}

	.hero-feature-slider .carousel-item {
		height: auto;
		min-height: 0;
	}

	.hero-feature-indicators {
		margin-top: 8px;
		padding-top: 4px;
	}

	.hero-feature-copy {
		padding-right: 0;
	}

	.hero-feature-control {
		top: 18px;
		bottom: auto;
	}

	.hero-feature-control.carousel-control-prev {
		right: 68px;
	}

	.hero-feature-control.carousel-control-next {
		right: 22px;
	}

	.hero-feature-indicators {
		margin-top: 14px;
		padding-top: 8px;
	}

	.hero-actions {
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
	}

	.hero-trust-text {
		text-align: center;
	}

	.btn-main {
		width: 100%;
		text-align: center;
		box-sizing: border-box;
	}

	.hero-trust-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 0;
	}

	.hero-trust-item {
		min-height: 40px;
		padding: 8px 6px;
		justify-content: start;
	}

	.hero-trust-item+.hero-trust-item {
		border-left: 0;
	}

	.hero-trust-item:nth-child(even) {
		border-left: 1px solid rgba(220, 229, 223, .35);
	}

	.hero-trust-item:nth-child(n+3) {
		border-top: 1px solid rgba(220, 229, 223, .35);
	}

	/* Marquee */
	.marquee-item img {
		height: 75px;
	}

	/* Steps */
	.process-card {
		min-height: 410px;
	}

	.steps-flow.process-grid.owl-carousel {
		display: block;
		margin-left: 0;
		margin-right: 0;
	}

	.steps-flow.process-grid.owl-carousel .owl-stage {
		display: flex;
	}

	.steps-flow.process-grid.owl-carousel .owl-item {
		display: flex;
	}

	.steps-flow.process-grid.owl-carousel .owl-item>.col-12 {
		width: 100%;
		max-width: none;
		flex: 0 0 auto;
		padding-left: 0;
		padding-right: 0;
		display: flex;
	}

	.steps-flow.process-grid.owl-carousel .process-card {
		min-height: 410px;
	}

	/* Flyer / materials */
	.materials-band {
		margin: 2.5rem -20px 0;
		padding: 44px 20px;
		border-left: 1px solid #dce5df;
		border-right: 1px solid #dce5df;
	}

	.materials-grid {
		justify-content: center;
	}

	.material-preview-card {
		min-height: 0;
		padding: 0;
	}

	.material-flyer-stack {
		width: min(100%, 340px);
		min-height: 350px;
		padding-bottom: 32px;
		overflow: clip;
	}

	.material-flyer-sheet {
		width: min(62%, 205px);
		bottom: 42px;
	}

	.material-flyer-front {
		transform: translateX(-58%) rotate(-5deg);
	}

	.material-flyer-back {
		transform: translateX(-40%) rotate(5deg);
	}


	/* About */
	.about-logo-card {
		min-height: 320px;
		max-width: none;
	}

	.about-logo-circle {
		width: clamp(150px, 44vw, 205px);
		height: clamp(150px, 44vw, 205px);
	}

	.about-logo-circle img {
		width: calc(100% - 14px);
		height: calc(100% - 14px);
	}

	/* Dashboard */
	#dashboard {
		padding: 72px 0;
	}

	.db-column {
		min-height: auto;
		justify-content: flex-start;
	}

	.db-media-stage {
		height: auto;
	}

	.db-desktop {
		flex: initial;
	}

	.phone-frame {
		width: min(100%, 292px);
		max-width: 292px;
		flex: initial;
	}

	.db-phone-wrap {
		align-items: center;
	}

	/* Pricing: stack to 1 col on mobile */
	.pricing-three {
		max-width: 100%;
	}

	.p-card {
		padding: 1.8rem;
	}

	.p-price {
		font-size: 2.4rem;
	}

	/* Community */
	.community-split {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	#problem .rv[style*='grid'] {
		grid-template-columns: 1fr;
	}

	.community-intro {
		gap: 2rem;
	}

	.avatar-preview-row {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.avatar-main-img {
		width: 70px;
		height: 70px;
	}

	.avatar-skins-mini {
		flex-direction: column;
		gap: 0.4rem;
	}

	.skin-mini-card {
		padding: 0.55rem 0.6rem;
	}

	.skin-mini-img {
		width: 30px;
		height: 30px;
	}

	.community-email-card {
		padding: 1.4rem;
	}

	.email-field-row {
		flex-direction: column;
	}

	.email-field-row button {
		width: 100%;
		padding: 0.75rem;
	}

	/* Contact */
	.c-form {
		padding: 1.6rem;
	}

	/* Footer */
	.f-inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 1.2rem;
	}

	.f-links {
		flex-wrap: wrap;
		gap: 1rem;
	}

	/* Headings */
	.sec-title {
		font-size: 1.7rem;
	}
}

@media(max-width:390px) {
	h1 {
		font-size: 3rem;
	}

	.hero-feature-slider {
		min-height: 0;
		height: auto;
	}

	.hero-feature-card {
		grid-template-rows: 1fr;
	}

	.p-card {
		padding: 1.4rem;
	}
}

@media(prefers-reduced-motion:reduce) {

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.001ms !important;
	}
}