/*
Theme Name: RankSniper Automotive
Theme URI: https://ranks.dscc.ai
Author: RankSniper
Author URI: https://ranks.dscc.ai
Description: Foreign-trade B2B block theme for automotive and new-energy vehicle exporters. Blacked-out industrial aesthetic: pure-black radial hero, electric-green accents, uppercase Archivo display type, a staggered 2x2 model grid, green-rule technology specs and a distributor inquiry CTA. Built for the RankSniper site factory.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ranksniper-automotive
Tags: block-theme, full-site-editing, one-column, custom-colors, custom-logo
*/

/*
 * Signature element: hero radial glow.
 * Warm graphite core fading to pure black, per the design token
 * radial-gradient(120% 100% at 70% 30%, #1a1a1e, #0b0b0c).
 */
.rsa-hero-bg {
	background-image: radial-gradient(120% 100% at 70% 30%, #1a1a1e 0%, #0b0b0c 60%);
}

/* Distributor CTA band: diagonal electric-green gradient. */
.rsa-cta-bg {
	background-image: linear-gradient(100deg, #22c55e, #4ade5a);
}

/* Image placeholder, industrial hatch: diagonal stripe weave in the
 * two panel greys, boxed with a card hairline. Centered mono label sits
 * on top (given by a child .rsa-slot-label). */
.rsa-photo-slot {
	background-image: repeating-linear-gradient(135deg, #161619 0 14px, #1e1e22 14px 28px);
	border: 1px solid #26262b;
	border-radius: 14px;
	overflow: hidden;
}
.rsa-slot-label {
	display: block;
	font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.875rem;
	color: #5a5a62;
	letter-spacing: 0.02em;
}

/* Big statistic numerals: Archivo 900, electric green, tabular. */
.rsa-stat {
	font-variant-numeric: tabular-nums;
}
.rsa-stat .rsa-stat-num {
	display: block;
	font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
	font-weight: 900;
	font-size: 2.125rem;
	line-height: 1;
	color: #4ade5a;
}

/* Technology spec cell: 2px electric-green rule down the left edge. */
.rsa-spec {
	border-left: 2px solid #4ade5a;
	padding-left: 1rem;
}

/* Model card: square-ish 14px radius, graphite hairline that brightens
 * to electric green on hover; content pins to the bottom of the tile. */
.rsa-model-card {
	border: 1px solid #26262b;
	border-radius: 14px;
	overflow: hidden;
	background-image: repeating-linear-gradient(135deg, #161619 0 14px, #1e1e22 14px 28px);
	display: flex;
	align-items: flex-end;
}
.rsa-model-card:hover {
	border-color: #4ade5a !important;
}
@media (prefers-reduced-motion: no-preference) {
	.rsa-model-card {
		transition: border-color 0.18s ease, transform 0.18s ease;
	}
	.rsa-model-card:hover {
		transform: translateY(-2px);
	}
}

/* Model category tag: electric green, wide tracking. */
.rsa-tag {
	color: #4ade5a;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* Tables never break the layout on narrow screens. */
.wp-block-table {
	overflow-x: auto;
}

/* Visible keyboard focus, site-wide. */
:focus-visible {
	outline: 2px solid #4ade5a;
	outline-offset: 2px;
}

/* Complete-page system: graphite/electric-green Velocity variant. */
:root {
	--rsfp-accent: #4ade5a;
	--rsfp-accent-strong: #22c55e;
	--rsfp-ink: #f4f4f5;
	--rsfp-text: #c4c4ca;
	--rsfp-muted: #85858e;
	--rsfp-line: #29292e;
	--rsfp-soft: #17171a;
	--rsfp-card: #121214;
	--rsfp-radius: 14px;
	--rsfp-shadow: 0 16px 38px rgba(0, 0, 0, 0.42);
}
.rsfp-banner {
	color: #fff;
	background:
		radial-gradient(100% 140% at 78% 20%, rgba(74, 222, 90, 0.18), transparent 44%),
		linear-gradient(120deg, #060607, #151519);
}
.rsfp-banner h1,
.rsfp-section h1,
.rsfp-section h2,
.rsfp-section h3,
.rsfp-faq button {
	color: #f4f4f5;
	font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
	font-weight: 800;
	text-transform: uppercase;
}
.rsfp-banner h1 {
	color: #fff;
	letter-spacing: -0.045em;
}
.rsfp-banner .rsfp-kicker {
	color: #4ade5a;
}
.rsfp-section,
.rsfp-tabs {
	color: var(--rsfp-text);
	background: #0b0b0c;
}
.rsfp-soft {
	background: #151518;
}
.rsfp-tabs {
	border-color: #29292e;
}
.rsfp-tabs a.is-active {
	color: #fff;
}
.rsfp-lead,
.rsfp-card-body p {
	color: #96969f;
}
.rsfp-card,
.rsfp-sidebar,
.rsfp-contact-cards article,
.rsfp-product-tabs {
	border-color: #29292e;
	background: #121214;
	box-shadow: none;
}
.rsfp-card:hover {
	border-color: #4ade5a;
}
.rsfp-photo {
	color: #606067;
	background: repeating-linear-gradient(135deg, #151518 0 16px, #1f1f23 16px 32px);
}
.rsfp-button {
	border-color: #4ade5a;
	color: #07150a;
	background: #4ade5a;
	text-transform: uppercase;
}
.rsfp-button:hover {
	color: #fff;
	background: #22c55e;
}
.rsfp-button-ghost {
	color: #4ade5a;
	background: transparent;
}
.rsfp-sidebar > strong {
	color: #09090a;
	background: #4ade5a;
}
.rsfp-sidebar > a {
	border-color: #29292e;
	color: #b6b6bd;
}
.rsfp-sidebar > a:hover,
.rsfp-sidebar > a.is-active,
.rsfp-tab-buttons button.is-active {
	color: #4ade5a;
	background: #1a1a1e;
}
.rsfp-help,
.rsfp-process {
	border: 1px solid #2c2c31;
	background: #151518;
}
.rsfp-help h3,
.rsfp-process h2 {
	color: #fff;
}
.rsfp-process,
.rsfp-stats {
	background:
		linear-gradient(100deg, rgba(74, 222, 90, 0.08), transparent),
		#101012;
}
.rsfp-service > span,
.rsfp-stats strong {
	color: #4ade5a;
	font-family: 'Archivo', sans-serif;
}
.rsfp-specs th,
.rsfp-specs td,
.rsfp-tab-buttons,
.rsfp-tab-buttons button,
.rsfp-faq,
.rsfp-faq article,
.rsfp-article-nav,
.rsfp-search-results article {
	border-color: #29292e;
}
.rsfp-chip-row button,
.rsfp-thumb,
.rsfp-form input,
.rsfp-form textarea,
.rsfp-search input {
	border-color: #323238;
	color: #bcbcc3;
	background: #151518;
}
.rsfp-chip-row button.is-active,
.rsfp-thumb.is-active {
	color: #07150a;
	background: #4ade5a;
}
.rsfp-tab-panel,
.rsfp-faq article > div {
	color: #aaaab1;
}
.rsfp-article blockquote,
.rsfp-facts div {
	color: #dedee2;
	background: #17171a;
}
.rsfp-search-results h2 a {
	color: #f4f4f5;
}
.rsfp-product .rsfp-photo,
.rsfp-case .rsfp-photo {
	min-height: 250px;
}
.rsfp-about-photo {
	border: 1px solid #29292e;
}
.rsa-photo-slot,
.rsa-model-card {
	background-image: linear-gradient(rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)), url('assets/images/automotive-suv.jpg');
	background-position: center;
	background-size: cover;
}
.rsa-photo-slot .rsa-slot-label,
.rsa-model-card .rsa-slot-label {
	display: none;
}