/*
Theme Name: Indranil.in — Approved Homepage
Theme URI: https://indranil.in/
Description: The approved Indranil.in homepage on top of the purchased Intro theme.
Author: Indranil Banerjee
Template: intro
Version: 1.1.2
Text Domain: intro-child-indranil
*/

:root {
	--indranil-cream: #f4f0e7;
	--indranil-paper: #fffdf8;
	--indranil-charcoal: #171714;
	--indranil-field: #ffffff;
	--indranil-muted: #6d695f;
	--indranil-yellow: #f4d43d;
	--indranil-copper: #ad6b43;
	--indranil-rule: rgba(84, 72, 55, 0.22);
}

.indranil-proof-panel,
.indranil-project-proof,
.indranil-contact-panel {
	border: 1px solid var(--indranil-rule);
	border-radius: 14px;
}

.indranil-proof-panel {
	background: var(--indranil-charcoal);
	color: #f8f4e9;
	padding: clamp(24px, 6vw, 42px);
}

.indranil-kicker,
.indranil-project-meta {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
}

.indranil-kicker {
	color: var(--indranil-yellow);
	margin: 0 0 14px;
}

.indranil-proof-panel h3 {
	color: inherit;
	font-size: clamp(1.7rem, 6vw, 2.5rem);
	margin: 0 0 14px;
}

.indranil-proof-panel p:last-child {
	color: rgba(248, 244, 233, 0.76);
	margin-bottom: 0;
}

.indranil-projects {
	display: grid;
	gap: 16px;
}

.indranil-project-proof {
	background: var(--indranil-paper);
	color: var(--indranil-charcoal);
	overflow: hidden;
	padding: 20px;
}

.indranil-project-proof--featured {
	min-height: 240px;
}

.indranil-project-proof h3 {
	font-size: clamp(1.35rem, 5vw, 1.85rem);
	margin: 7px 0 10px;
}

.indranil-project-proof p {
	color: var(--indranil-muted);
	margin: 0;
}

.indranil-project-meta {
	color: var(--indranil-copper);
}

.indranil-system-map {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin: 24px 0 18px;
}

.indranil-system-map span {
	align-items: center;
	background: #ece7db;
	border: 1px solid var(--indranil-rule);
	border-radius: 8px;
	display: flex;
	font-size: 0.72rem;
	font-weight: 700;
	justify-content: center;
	min-height: 62px;
	padding: 8px;
	text-align: center;
}

.indranil-project-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.indranil-project-link {
	display: inline-flex;
	font-weight: 700;
	gap: 7px;
	margin-top: 16px;
	text-decoration: none;
}

.indranil-contact-panel {
	background: var(--indranil-paper);
	padding: clamp(20px, 5vw, 32px);
}

.indranil-contact-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 16px;
}

.indranil-contact-field--wide {
	grid-column: 1 / -1;
}

.indranil-contact-field label {
	display: block;
	font-size: 0.82rem;
	font-weight: 700;
	margin-bottom: 7px;
}

.indranil-contact-field input,
.indranil-contact-field textarea {
	background: var(--indranil-field) !important;
	border: 1px solid var(--indranil-rule);
	border-radius: 8px;
	color: inherit !important;
	font: inherit;
	padding: 11px 12px;
	width: 100%;
}

.indranil-contact-field textarea {
	min-height: 126px;
	resize: vertical;
}

.indranil-contact-field input:focus,
.indranil-contact-field textarea:focus {
	border-color: var(--indranil-copper);
	box-shadow: 0 0 0 3px rgba(173, 107, 67, 0.18);
	outline: none;
}

.indranil-contact-footer {
	align-items: center;
	display: flex;
	gap: 18px;
	justify-content: space-between;
	margin-top: 20px;
}

.indranil-contact-footer p {
	color: var(--indranil-muted);
	font-size: 0.78rem;
	margin: 0;
	max-width: 390px;
}

.indranil-contact-footer button {
	background: var(--indranil-yellow) !important;
	border: 1px solid #c0a51d;
	border-radius: 999px;
	color: var(--indranil-charcoal) !important;
	cursor: pointer;
	font: inherit;
	font-weight: 800;
	padding: 11px 18px;
	white-space: nowrap;
}

.indranil-form-message {
	color: var(--indranil-muted);
	font-size: 0.82rem;
	margin: 14px 0 0;
}

.cs-creating__item {
	border-color: var(--indranil-rule) !important;
}

.cs-creating__item:hover {
	border-color: var(--indranil-copper) !important;
}

.cs-hero {
	--cs-status-background: #fff4ae;
	--cs-status-color: #725d00;
	--cs-status-background-dark: #443b12;
	--cs-status-color-dark: var(--indranil-yellow);
}

.cs-hero__button.cs-button {
	background: var(--indranil-yellow) !important;
	border-color: #c0a51d !important;
	color: var(--indranil-charcoal) !important;
}

.cs-hero__button.cs-button:hover,
.cs-hero__button.cs-button:focus-visible {
	background: #ffe763 !important;
}

[data-scheme=dark] {
	--indranil-paper: #24231f;
	--indranil-charcoal: #151512;
	--indranil-field: #191914;
	--indranil-muted: #bcb6aa;
	--indranil-rule: rgba(244, 240, 231, 0.2);
}

[data-scheme=dark] .indranil-system-map span {
	background: #302f29;
}

@media (max-width: 720px) {
	.indranil-project-grid,
	.indranil-contact-grid,
	.indranil-system-map {
		grid-template-columns: 1fr;
	}

	.indranil-contact-footer {
		align-items: stretch;
		flex-direction: column;
	}
}
