/* Instofy — front-end enhancements on top of theme.json styles */

/* ---------- General ---------- */
img { height: auto; max-width: 100%; }

.instofy-hero-stripes {
	position: relative;
	background-image: repeating-linear-gradient(
		90deg,
		rgba(255,255,255,0.35) 0px,
		rgba(255,255,255,0.35) 60px,
		rgba(255,255,255,0) 60px,
		rgba(255,255,255,0) 120px
	);
}

.instofy-dotted-bg {
	position: relative;
	background-image: radial-gradient(rgba(109,63,240,0.18) 1.5px, transparent 1.5px);
	background-size: 22px 22px;
}

/* First project card highlighted, matching reference */
.instofy-projects-list .wp-block-post-template > li:first-child > .wp-block-group {
	background: #F2ECFF;
	border-color: #6D3FF0 !important;
}

/* Footer social icons: outlined circles */
.instofy-social-outline .wp-social-link {
	border: 1.5px solid #6D3FF0;
	background: transparent !important;
}
.instofy-social-outline .wp-social-link svg { fill: #6D3FF0; }

.wp-block-navigation__responsive-container.has-modal-open {
	background: #150F23 !important;
}

/* Buttons: nicer hover motion */
.wp-block-button__link,
.instofy-submit-btn {
	transition: transform .15s ease, background-color .15s ease, color .15s ease;
}
.wp-block-button__link:hover,
.instofy-submit-btn:hover {
	transform: translateY(-2px);
}

/* Outline button style tweak */
.wp-block-button.is-style-outline .wp-block-button__link {
	border-color: currentColor;
}

/* ---------- FAQ (details/summary) ---------- */
.wp-block-details,
details.instofy-faq {
	background: transparent;
	border: none;
	border-bottom: 1px solid #E7E1F7;
	border-radius: 0;
	padding: 1.1rem 0.25rem;
}
.wp-block-details summary,
details.instofy-faq summary {
	cursor: pointer;
	font-weight: 700;
	font-size: 1.05rem;
	list-style: none;
	position: relative;
	padding-right: 2rem;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after,
details.instofy-faq summary::after {
	content: "⌄";
	position: absolute;
	right: 0;
	top: -4px;
	font-size: 1.4rem;
	color: #150F23;
	transition: transform .2s ease;
}
.wp-block-details[open] summary::after,
details.instofy-faq[open] summary::after {
	transform: rotate(180deg);
}
.wp-block-details p,
details.instofy-faq p {
	margin-top: .75rem;
	color: #645F73;
}
/* First FAQ item highlighted, matching reference */
details.instofy-faq-open {
	background: #F2ECFF;
	border: 1px solid #6D3FF0;
	border-radius: 14px;
	padding: 1.1rem 1.4rem;
}

/* ---------- Contact form ---------- */
.instofy-contact-form { display: block; }
.instofy-form-row { margin-bottom: 1.25rem; }
.instofy-form-row--split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
}
.instofy-contact-form label {
	display: block;
	font-weight: 600;
	font-size: .95rem;
	margin-bottom: .4rem;
	color: #150F23;
}
.instofy-contact-form input,
.instofy-contact-form select,
.instofy-contact-form textarea {
	width: 100%;
	padding: .8rem 1rem;
	border: 1px solid #E7E1F7;
	border-radius: 10px;
	font-size: 1rem;
	font-family: inherit;
	background: #fff;
	color: #150F23;
	box-sizing: border-box;
}
.instofy-contact-form input:focus,
.instofy-contact-form select:focus,
.instofy-contact-form textarea:focus {
	outline: none;
	border-color: #6D3FF0;
	box-shadow: 0 0 0 3px rgba(34,197,94,.15);
}
.instofy-submit-btn {
	display: inline-block;
	background: #150F23;
	color: #fff;
	border: none;
	padding: .9rem 2rem;
	border-radius: 999px;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
}
.instofy-submit-btn:hover { background: #6D3FF0; color: #150F23; }

.instofy-form-notice {
	padding: .8rem 1rem;
	border-radius: 10px;
	margin-bottom: 1.25rem;
	font-size: .95rem;
}
.instofy-form-notice--success { background: #EAE0FF; color: #3B1F8C; }
.instofy-form-notice--error { background: #FEE2E2; color: #7F1D1D; }

/* ---------- Responsive ---------- */
@media (max-width: 782px) {
	.instofy-form-row--split { grid-template-columns: 1fr; }
	.wp-block-columns:not(.is-not-stacked-on-mobile) { gap: 1.5rem !important; }
	/* Floating hero stat badges: keep inside viewport on small screens */
	.wp-block-group[style*="position:absolute"] { position: static !important; margin-top: .75rem; }
}