/* variants-solar.css — 4 distinct solar/rental sites */

/* ═══ 09 · HELIOPOLIS TRADE — Asymmetric hero w/ sun ═══ */
[data-variant="heliopolis-trade"] .hero {
  position: relative; overflow: hidden;
  padding-block: clamp(96px, 13vw, 160px);
  background:
    radial-gradient(circle at 100% 0%, rgba(224, 122, 44, 0.22) 0%, rgba(224, 122, 44, 0.08) 25%, transparent 50%),
    linear-gradient(180deg, #FFF8EC 0%, var(--bg) 70%);
}
[data-variant="heliopolis-trade"] .hero::after {
  content: "";
  position: absolute;
  width: 320px; height: 320px;
  top: -120px; right: -120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(224, 122, 44, 0.30), rgba(224, 122, 44, 0.05) 60%, transparent 75%);
  pointer-events: none;
}
[data-variant="heliopolis-trade"] .hero h1 em { color: var(--accent); }
[data-variant="heliopolis-trade"] .tile-icon {
  background: linear-gradient(135deg, rgba(224, 122, 44, 0.20), rgba(224, 122, 44, 0.08));
  color: var(--accent);
}
[data-variant="heliopolis-trade"] .value-item .num { color: var(--accent); }

/* ═══ 10 · NORDSOL TRADE — Dark green nav over cream hero ═══ */
[data-variant="nordsol-trade"] .nav { --nav-bg: #2D5A3D; background: #2D5A3D; border-bottom: 0; backdrop-filter: none; }
[data-variant="nordsol-trade"] .nav .brand,
[data-variant="nordsol-trade"] .nav .nav-links a,
[data-variant="nordsol-trade"] .nav .lang-switch a { color: #FAF7F0; }
[data-variant="nordsol-trade"] .nav .nav-links a:hover { color: var(--accent); }
[data-variant="nordsol-trade"] .nav .nav-links a[aria-current="page"]::after { background: var(--accent); }
[data-variant="nordsol-trade"] .lang-switch { border-color: rgba(250,247,240,0.3); }
[data-variant="nordsol-trade"] .lang-switch a[aria-current="true"] { background: var(--accent); color: #1F2937; }
[data-variant="nordsol-trade"] .hero {
  background:
    radial-gradient(50% 50% at 90% 0%, rgba(45, 90, 61, 0.14), transparent 70%),
    radial-gradient(40% 60% at 10% 100%, rgba(224, 122, 44, 0.10), transparent 70%);
  border-top: 6px solid var(--accent);
}
[data-variant="nordsol-trade"] .hero h1 em { color: var(--primary); font-style: normal; }
[data-variant="nordsol-trade"] .hero-eyebrow { color: var(--accent); }
[data-variant="nordsol-trade"] .tile { background: #F7F4EC; border: 0; border-bottom: 2px solid var(--primary); }
[data-variant="nordsol-trade"] .tile:hover { background: #FFFFFF; border-bottom-color: var(--accent); }
[data-variant="nordsol-trade"] .tile-icon { background: #FFFFFF; color: var(--primary); border: 1px solid var(--border); }

/* ═══ 11 · SOLARIS RENT — Rental price-tag aesthetic ═══ */
[data-variant="solaris-rent"] .nav { backdrop-filter: none; background: #FFFFFF; }
[data-variant="solaris-rent"] .hero {
  background: radial-gradient(70% 60% at 20% 0%, rgba(224, 122, 44, 0.15), transparent 60%);
}
[data-variant="solaris-rent"] .hero-eyebrow {
  background: var(--accent); color: #FFFFFF;
  padding: 5px 14px;
  border-radius: 4px;
  letter-spacing: 0.14em;
  display: inline-block;
  position: relative;
}
[data-variant="solaris-rent"] .hero-eyebrow::after {
  content: ""; position: absolute;
  top: 50%; right: -6px;
  transform: translateY(-50%) rotate(45deg);
  width: 12px; height: 12px;
  background: var(--accent);
  z-index: -1;
}
[data-variant="solaris-rent"] .hero h1 em { color: var(--accent); font-style: normal; }
[data-variant="solaris-rent"] .tile { border-bottom: 3px solid var(--accent); }
[data-variant="solaris-rent"] .tile-icon { background: var(--accent); color: #FFFFFF; }
[data-variant="solaris-rent"] .value-item .num { color: var(--accent); }
[data-variant="solaris-rent"] .btn-primary { background: var(--accent); border-color: var(--accent); }
[data-variant="solaris-rent"] .btn-primary:hover { background: #C26A24; border-color: #C26A24; }

/* ═══ 12 · SONARA TRADE — Soft, rounded, friendly ═══ */
[data-variant="sonara-trade"] {
  --btn-radius: 999px;
  --card-radius: 24px;
  --input-radius: 18px;
}
[data-variant="sonara-trade"] .nav-inner {
  background: #FFFFFF; border-radius: 999px;
  padding: 8px 24px; min-height: 56px;
  margin: 12px 16px;
  box-shadow: 0 4px 12px -6px rgba(31, 41, 55, 0.10);
  border: 1px solid var(--border);
  max-width: calc(1180px - 32px);
}
[data-variant="sonara-trade"] .nav {
  background: transparent; border-bottom: 0;
}
[data-variant="sonara-trade"] .hero {
  background:
    radial-gradient(60% 60% at 50% 0%, rgba(224, 122, 44, 0.12), transparent 60%),
    radial-gradient(50% 50% at 0% 100%, rgba(45, 90, 61, 0.06), transparent 60%);
}
[data-variant="sonara-trade"] .tile {
  background: #FFFFFF;
  box-shadow: 0 2px 6px rgba(31, 41, 55, 0.06), 0 12px 24px -16px rgba(45, 90, 61, 0.12);
  border: 0;
  padding: 32px;
}
[data-variant="sonara-trade"] .tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(31, 41, 55, 0.08), 0 24px 48px -20px rgba(45, 90, 61, 0.18);
}
[data-variant="sonara-trade"] .tile-icon {
  width: 56px; height: 56px;
  background: var(--accent);
  color: #FFFFFF;
  border-radius: 999px;
}
[data-variant="sonara-trade"] .hero h1 em { color: var(--accent); font-style: italic; }