/* MICE Labs Core — front-end styles for site-specific shortcodes. */

/* ---------- Shared form base ---------- */
.mice-collab-form {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 16px;
	font: inherit;
}
.mice-form__title { margin: 0 0 4px; font-size: 1.6rem; line-height: 1.2; }
.mice-form__intro { margin: 0 0 8px; color: #555; }
.mice-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 600px) { .mice-form__row { grid-template-columns: 1fr; } }
.mice-form__field { display: flex; flex-direction: column; gap: 6px; font-size: 0.95rem; }
.mice-form__field span em { color: #c0392b; font-style: normal; margin-left: 2px; }
.mice-form__field input,
.mice-form__field select,
.mice-form__field textarea {
	padding: 10px 12px;
	border: 1px solid #cfd4da;
	border-radius: 6px;
	font: inherit;
	background: #fff;
	transition: border-color .15s ease;
}
.mice-form__field input:focus,
.mice-form__field select:focus,
.mice-form__field textarea:focus {
	outline: none;
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}
.mice-form__hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px; height: 1px; overflow: hidden;
}
.mice-form__submit {
	align-self: flex-start;
	padding: 12px 24px;
	border: 0;
	border-radius: 6px;
	background: #1e3a8a;
	color: #fff;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease;
}
.mice-form__submit:hover { background: #1d4ed8; }
.mice-form__submit[disabled] { opacity: 0.6; cursor: progress; }
.mice-form__status { min-height: 1.4em; font-size: 0.95rem; }
.mice-form__status.is-error { color: #c0392b; }
.mice-form__status.is-success { color: #15803d; }

/* ---------- Contact card ---------- */
.mice-contact { max-width: 720px; margin: 0 auto; }
.mice-contact__title { margin: 0 0 16px; font-size: 1.6rem; }
.mice-contact__list { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 12px; }
.mice-contact__item { display: grid; grid-template-columns: 120px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid #eef0f3; }
.mice-contact__label { color: #6b7280; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; }
.mice-contact__value { color: #111827; word-break: break-word; }
a.mice-contact__value { color: #1d4ed8; text-decoration: none; }
a.mice-contact__value:hover { text-decoration: underline; }
.mice-contact__socials { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.mice-contact__socials a {
	display: inline-block; padding: 6px 12px; border: 1px solid #d1d5db; border-radius: 999px;
	color: #111827; text-decoration: none; font-size: 0.9rem;
}
.mice-contact__socials a:hover { background: #f3f4f6; }

/* ---------- Unified blog ---------- */
.mice-blog { display: flex; flex-direction: column; gap: 24px; }
.mice-blog__tabs { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.mice-blog__tab {
	padding: 8px 16px; border: 1px solid #d1d5db; background: #fff;
	border-radius: 999px; cursor: pointer; font: inherit; color: #374151;
	transition: all .15s ease;
}
.mice-blog__tab:hover { background: #f3f4f6; }
.mice-blog__tab.is-active { background: #1e3a8a; color: #fff; border-color: #1e3a8a; }
.mice-blog__grid {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.mice-blog__card {
	display: flex; flex-direction: column; background: #fff;
	border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden;
	transition: transform .15s ease, box-shadow .15s ease;
}
.mice-blog__card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(15, 23, 42, .08); }
.mice-blog__card.is-hidden { display: none; }
.mice-blog__thumb { display: block; aspect-ratio: 16/9; background: #f3f4f6; overflow: hidden; }
.mice-blog__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mice-blog__body { padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.mice-blog__cat {
	display: inline-block; align-self: flex-start;
	padding: 2px 8px; border-radius: 4px; background: #eef2ff; color: #1e3a8a;
	font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
}
.mice-blog__title { margin: 0; font-size: 1.1rem; line-height: 1.35; }
.mice-blog__title a { color: #111827; text-decoration: none; }
.mice-blog__title a:hover { color: #1d4ed8; }
.mice-blog__excerpt { margin: 0; color: #4b5563; font-size: 0.95rem; }
.mice-blog__more { color: #1d4ed8; text-decoration: none; font-weight: 500; font-size: 0.9rem; margin-top: auto; }
.mice-blog__more:hover { text-decoration: underline; }
.mice-blog__pagination { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; padding-top: 8px; }
.mice-blog__pagination .page-numbers {
	padding: 6px 12px; border: 1px solid #d1d5db; border-radius: 6px;
	color: #374151; text-decoration: none; font-size: 0.9rem;
}
.mice-blog__pagination .page-numbers.current { background: #1e3a8a; color: #fff; border-color: #1e3a8a; }
.mice-blog__empty { color: #6b7280; }

/* ---------- Projects grid ---------- */
.mice-projects__grid {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.mice-projects__card {
	background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden;
	display: flex; flex-direction: column;
	transition: transform .15s ease, box-shadow .15s ease;
}
.mice-projects__card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(15, 23, 42, .08); }
.mice-projects__thumb { display: block; aspect-ratio: 4/3; background: #f3f4f6; overflow: hidden; }
.mice-projects__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mice-projects__body { padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.mice-projects__title { margin: 0; font-size: 1.15rem; }
.mice-projects__title a { color: #111827; text-decoration: none; }
.mice-projects__title a:hover { color: #1d4ed8; }
.mice-projects__excerpt { margin: 0; color: #4b5563; font-size: 0.95rem; }
.mice-projects__more { color: #1d4ed8; text-decoration: none; font-weight: 500; font-size: 0.9rem; margin-top: auto; }
.mice-projects__more:hover { text-decoration: underline; }
.mice-projects__empty { color: #6b7280; }

/* ---------- Marquee ---------- */
.mice-marquee {
	overflow: hidden;
	width: 100%;
	height: var(--mice-marquee-height, 80px);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.mice-marquee__track {
	display: flex;
	align-items: center;
	gap: var(--mice-marquee-gap, 48px);
	width: max-content;
	animation: mice-marquee-scroll var(--mice-marquee-speed, 30s) linear infinite;
	animation-direction: var(--mice-marquee-direction, normal);
}
.mice-marquee:hover .mice-marquee__track { animation-play-state: paused; }
.mice-marquee__item img {
	display: block;
	height: var(--mice-marquee-height, 80px);
	width: auto;
	max-width: none;
	object-fit: contain;
}
@keyframes mice-marquee-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.mice-marquee__track { animation: none; }
}
