/* ==========================================================================
 * Component: 09 — Form Section (.imea-form)
 * Input/select rules are written against bare tags inside .imea-form__card
 * so shortcode-rendered forms (WPForms / Gravity / CF7) inherit the design.
 * Visible labels are kept for a11y but visually hidden per Figma
 * (placeholder-labelled fields).
 * ========================================================================== */

.imea-form {
	padding: 96px 0 110px;
	color: var(--text-color);
	/* Figma: green glow rising behind the form card */
	background: #06110E;
	position: relative;
}

section#imea-form::after {
    content: "";
    background: radial-gradient(60% 60% at 60% 60%, rgba(66, 218, 136, 0.28) 0%, rgba(66, 218, 136, 0.00) 70%);
    height: 450px;
    width: 500px;
    bottom: -20%;
    position: absolute;
    left: -15%;
    z-index: 0;
}

section#imea-form::before {
    content: "";
    height: 400px;
    width: 425px;
    top: -35%;
    position: absolute;
    right: 0%;
    z-index: 0;
    background: radial-gradient(70% 55% at 60% 65%, rgba(66, 218, 136, 0.28) 0%, rgba(66, 218, 136, 0.00) 70%);
}

/* Layout via Bootstrap .row / .col-lg-6 */

/* --- left content ------------------------------------------------------------ */
.imea-form__eyebrow {
	margin: 0 0 14px;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--base-color);
	line-height: 56px;
}
.imea-form__title {
	margin: 0 0 25px;
    font-size: 48px;
    line-height: 1.16;
    font-weight: 400;
    letter-spacing: -0.01em;
    background-image: linear-gradient(180deg, #FFFFFF 25%, #0C1711 343.26%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
.imea-form__desc {
	margin: 0 0 26px;
	font-size: 18px;
	line-height: 22px;
	color: rgba(246, 246, 246, 0.66);
}

.imea-form__points { margin: 0; padding: 0; list-style: none; }
.imea-form__points li {
	position: relative;
	padding: 7px 0 7px 30px;
	font-size: 16px;
	color: rgba(246, 246, 246, 1);
}
.imea-form__points li::before {
	content: "\2713";
	position: absolute;
	left: 0;
	top: 6px;
	font-weight: 700;
	color: var(--primary-color);
}

/* --- form card ----------------------------------------------------------------- */
.imea-form__card {
	padding: 34px;
	
	 /* card over glow */
	border-radius: 20px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	background: linear-gradient(160deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%);
	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.12) inset, 0 40px 90px 0 rgba(0, 0, 0, 0.50);
	backdrop-filter: blur(6px);
}

.imea-form__card-title {
	margin: 0 0 6px;
	font-size: 18px;
	font-weight: 400;
	color: #fff;
}
.imea-form__card-sub {
	margin: 0 0 24px;
	font-size: 14px;
	color: rgba(246, 246, 246, 0.7);
	letter-spacing: 5%;
	font-weight: 300;
}

/* Field grid via Bootstrap .row.g-3 / .col-md-6 */
.imea-form__field { display: block; position: relative; }

/* a11y label — visually hidden, Figma uses placeholder-labelled fields */
.imea-form__label {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* bare-tag rules so shortcode form output inherits the design */
.imea-form__card input[type="text"],
.imea-form__card input[type="email"],
.imea-form__card input[type="tel"],
.imea-form__card select,
.imea-form__card textarea {
	width: 100%;
	padding: 20px 15px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.035); /* field surface */
	color: var(--text-color);
	font-size: 14px;
	font-family: inherit;
	outline: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	appearance: none;
	-webkit-appearance: none;
}
.imea-form__card select {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23ffffff' stroke-opacity='.55' fill='none' stroke-width='1.4' stroke-linecap='round'/></svg>");
	background-repeat: no-repeat;
	background-position: right 14px center;
	color: rgba(255, 255, 255, 0.55);
}
.imea-form__card ::placeholder { color: rgba(255, 255, 255, 0.42); }

.imea-form__card input:focus,
.imea-form__card select:focus,
.imea-form__card textarea:focus {
	border-color: rgba(214, 255, 65, 0.55);
	box-shadow: 0 0 0 3px rgba(214, 255, 65, 0.12);
}

.imea-form__submit,
.imea-form__card input[type="submit"],
.imea-form__card button[type="submit"] {
	width: 100%;
	margin-top: 30px;
	padding: 14px 24px;
	border: 0;
	border-radius: 8px;
	background: var(--secondary-color);
	color: #0a0d05; /* on-accent ink */
	font-size: 18px;
	font-weight: 500;
	font-family: inherit;
	cursor: pointer;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.imea-form__submit:hover,
.imea-form__card input[type="submit"]:hover,
.imea-form__card button[type="submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 30px -10px var(--lime-glow);
}

.imea-form__footnote {
	margin: 10px 0 0;
	font-size: 12px;
	text-align: center;
	color: rgba(255, 255, 255, 0.4);
}

/* --- responsive -------------------------------------------------------------------- */
@media (max-width: 991.98px) {
	.imea-form { padding: 64px 0 80px; }
	.imea-form__title {
	    font-size: 28px;
	}
}

@media(max-width:768px){
	section#imea-form::after {
	    left: 0;
	    border: 0;
	    width: 100%;
	}
}

@media (max-width: 575.98px) {
	.imea-form__card { padding: 24px 20px; }
}
@media (prefers-reduced-motion: reduce) {
	.imea-form__submit,
	.imea-form__card input,
	.imea-form__card select { transition: none; }
}
