/* ============================================================
   Skin: SOLAR
   For: Heliopolis Trade, Nordsol Trade, Solaris Rent, Sonara Trade
   Vibe: warm cream paper, deep forest green, copper accents —
         grounded, sustainable, energetic without being neon
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Fraunces:wght@500;600&family=JetBrains+Mono:wght@400&display=swap");

:root[data-skin="solar"],
[data-skin="solar"] {
  /* Type */
  --font-body:    "Manrope", system-ui, -apple-system, sans-serif;
  --font-display: "Fraunces", "Manrope", serif;
  --font-mono:    "JetBrains Mono", ui-monospace, monospace;
  --brand-size:   18px;
  --brand-weight: 600;
  --brand-track:  -0.01em;
  --hero-weight:  600;
  --hero-size:    4.4rem;
  --hero-track:   -0.025em;
  --hero-lh:      1.05;

  /* Color — warm paper, deep forest, copper sun */
  --bg:            #FAF7F0;
  --surface:       #FFFFFF;
  --surface-hover: #FFFCF5;
  --fg:            #1F2937;
  --fg-muted:      #5C6B5E;
  --fg-subtle:     #8E9686;

  --primary:       #2D5A3D;       /* deep forest green */
  --primary-hover: #244B32;
  --primary-soft:  rgba(45, 90, 61, 0.10);
  --on-primary:    #FAF7F0;

  --accent:        #E07A2C;       /* warm copper sun */
  --success:       #4A7C59;
  --success-soft:  rgba(74, 124, 89, 0.12);

  --border:        #E5E0D5;
  --border-strong: #C9C2B2;
  --border-subtle: #EFEAD F;

  --nav-bg:        rgba(250, 247, 240, 0.85);
  --nav-blur:      saturate(150%) blur(12px);
  --footer-bg:     #F2EDE0;
  --cta-bg:        linear-gradient(135deg, #2D5A3D 0%, #1F4530 100%);

  /* Shape — friendly, rounded but not bubbly */
  --btn-radius:    14px;
  --card-radius:   18px;
  --input-radius:  12px;
  --icon-radius:   12px;
}

/* Hero glow — warm sun */
[data-skin="solar"] .hero {
  background:
    radial-gradient(60% 60% at 90% 10%, rgba(224, 122, 44, 0.10), transparent 60%),
    radial-gradient(40% 40% at 10% 90%, rgba(45, 90, 61, 0.06), transparent 60%);
}
[data-skin="solar"] .hero h1 {
  font-weight: 600;
}
[data-skin="solar"] .hero h1 em {
  font-style: italic;
  color: var(--accent);
  font-weight: 500;
}

/* Section heads */
[data-skin="solar"] .section-head h2 {
  font-weight: 600;
}

/* Tiles */
[data-skin="solar"] .tile {
  background: var(--surface);
  box-shadow: 0 1px 2px rgba(31, 41, 55, 0.04);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
[data-skin="solar"] .tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px -12px rgba(45, 90, 61, 0.18);
  border-color: var(--primary);
}
[data-skin="solar"] .tile-icon {
  background: var(--primary-soft);
  color: var(--primary);
}

/* Value row — copper numerals */
[data-skin="solar"] .value-item .num { color: var(--accent); }

/* CTA banner — dark green block */
[data-skin="solar"] .cta-banner {
  background: var(--cta-bg);
  border-color: transparent;
  color: #F5F1E8;
}
[data-skin="solar"] .cta-banner h2 { color: #FAF7F0; }
[data-skin="solar"] .cta-banner .eyebrow { color: rgba(250,247,240,0.88); }
[data-skin="solar"] .cta-banner .cta-sub { color: rgba(250,247,240,0.96); }
[data-skin="solar"] .cta-banner .cta-mail { color: rgba(250,247,240,0.9); }
[data-skin="solar"] .cta-banner .cta-mail:hover { color: #FAF7F0; }
[data-skin="solar"] .cta-banner .btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #FFFFFF;
}
[data-skin="solar"] .cta-banner .btn-primary:hover { background: #C26A24; border-color: #C26A24; }
[data-skin="solar"] .cta-banner .btn-ghost {
  color: #FAF7F0;
  border-color: rgba(250, 247, 240, 0.4);
}
[data-skin="solar"] .cta-banner .btn-ghost:hover { border-color: #FAF7F0; }

/* Section tinted */
[data-skin="solar"] .section-tinted {
  background: var(--footer-bg);
}