/* ==========================================================================
   AK ENTERPRISES — INNER-PAGE COMPONENTS (Phase 3)
   Link-arrow (raw HTML, not an Elementor button widget), AMC pricing table,
   and contact form styling. Enqueued site-wide (unlike home.css).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Text link with arrow — used directly in raw HTML (text-editor widgets),
   NOT as an Elementor "CSS Classes" value, so it styles the <a> itself
   rather than needing the ".x .elementor-button" wrapper pattern.
   -------------------------------------------------------------------------- */
.ak-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: var(--space-1);
	color: var(--ak-blue);
	font-family: var(--ak-font-heading);
	font-weight: 600;
	font-size: var(--fs-small);
	text-decoration: none;
	transition: gap var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out);
}
.ak-link-arrow:hover { color: var(--ak-teal); gap: var(--space-2); }

/* --------------------------------------------------------------------------
   AMC comparison table
   -------------------------------------------------------------------------- */
.ak-pricing-table {
	overflow-x: auto;
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
	background: var(--ak-white);
}
.ak-pricing-table__table {
	width: 100%;
	border-collapse: collapse;
	min-width: 640px;
	font-size: var(--fs-body);
}
.ak-pricing-table__table th,
.ak-pricing-table__table td {
	padding: var(--space-4) var(--space-5);
	text-align: center;
	border-bottom: 1px solid rgba(11,31,58,0.08);
}
.ak-pricing-table__table thead th {
	font-family: var(--ak-font-heading);
	font-weight: 700;
	color: var(--ak-navy);
	background: var(--ak-light-grey);
	font-size: var(--fs-h4);
}
.ak-pricing-table__feature-col {
	text-align: left !important;
	font-weight: 400;
	color: var(--ak-text-muted);
}
.ak-pricing-table__table tbody td.ak-pricing-table__feature-col,
.ak-pricing-table__table tbody th.ak-pricing-table__feature-col {
	text-align: left !important;
	color: var(--ak-navy);
	font-weight: 500;
}
.ak-pricing-table__featured {
	background: rgba(0,159,227,0.06);
	position: relative;
}
thead .ak-pricing-table__featured {
	background: var(--ak-gradient-primary);
	color: var(--ak-white) !important;
}
.ak-pricing-table__table tbody tr:last-child td { border-bottom: none; }

/* --------------------------------------------------------------------------
   Contact form (Elementor Pro/PRO Elements Form widget)
   -------------------------------------------------------------------------- */
.ak-card .elementor-form .elementor-field-group { margin-bottom: var(--space-4); }
.ak-card .elementor-form label {
	font-family: var(--ak-font-heading);
	font-weight: 600;
	font-size: var(--fs-small);
	color: var(--ak-navy);
	margin-bottom: var(--space-2);
	display: block;
}
.ak-card .elementor-form .elementor-field-textual {
	width: 100%;
	padding: 14px 16px;
	border: 1.5px solid rgba(11,31,58,0.15);
	border-radius: var(--radius-sm);
	font-family: var(--ak-font-body);
	font-size: var(--fs-body);
	transition: border-color var(--dur-micro) var(--ease-out);
}
.ak-card .elementor-form .elementor-field-textual:focus {
	outline: none;
	border-color: var(--ak-blue);
}
.ak-card .elementor-form .elementor-button {
	background: var(--ak-gradient-primary) !important;
	color: var(--ak-white) !important;
	border: none;
	border-radius: var(--radius-md);
	padding: 16px 32px;
	font-family: var(--ak-font-heading);
	font-weight: 600;
	width: 100%;
	cursor: pointer;
}

/* --------------------------------------------------------------------------
   Inner-page hero spacing: pages without a full-viewport hero (About,
   Services, Products, Industries, Projects, AMC, Contact) still need room
   below the fixed transparent header so the first heading doesn't sit
   underneath it. Verified against actual markup: Elementor wraps page
   content in [data-elementor-type="wp-page"] with no <main> landmark; the
   homepage's own .ak-hero (not .ak-section--dark) is naturally excluded.
   -------------------------------------------------------------------------- */
[data-elementor-type="wp-page"] > .ak-section--dark:first-child {
	padding-top: calc(var(--space-9) + 96px) !important;
}
@media (max-width: 767px) {
	[data-elementor-type="wp-page"] > .ak-section--dark:first-child {
		padding-top: calc(var(--space-7) + 88px) !important;
	}
}