/*
  WenaIT refined concept
  Cel: zachowac technologiczny charakter, ale ograniczyc efekt generycznego
  "AI landing page" przez spokojniejszy rytm, ostrzejsze karty i jasne sekcje.
*/

:root {
  --wenait-bg: #07111f;
  --wenait-panel: #0d1a2b;
  --wenait-panel-strong: #101f33;
  --wenait-line: rgba(226, 232, 240, 0.14);
  --wenait-text: #f8fafc;
  --wenait-muted: #b8c2cf;
  --wenait-gold: #f6b21a;
  --wenait-gold-soft: rgba(246, 178, 26, 0.14);
  --wenait-blue: #2aa7d7;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--wenait-bg);
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -20;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 58%);
}

.absolute .rounded-full.blur-3xl {
  opacity: 0.35;
  filter: blur(56px);
}

.rounded-3xl,
.rounded-\[2rem\],
.rounded-\[1\.5rem\],
.rounded-2xl {
  border-radius: 14px !important;
}

.rounded-full {
  border-radius: 999px !important;
}

.shadow-glow,
.shadow-soft,
.shadow-\[0_0_60px_rgba\(251\,191\,36\,0\.12\)\] {
  box-shadow: 0 18px 42px rgba(2, 6, 23, 0.22) !important;
}

header {
  background: rgba(7, 17, 31, 0.88) !important;
}

header img {
  background: #111827;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

.wenait-logo-light {
  background: transparent !important;
  box-shadow: none !important;
}

.wenait-light-header {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.1) !important;
  color: #0f172a;
}

.wenait-light-header nav,
.wenait-light-header a {
  color: #334155 !important;
}

.wenait-light-header nav a:hover,
.wenait-light-header a:hover {
  color: #0f172a !important;
}

header nav {
  scrollbar-width: none;
}

header nav::-webkit-scrollbar {
  display: none;
}

h1,
h2,
h3 {
  letter-spacing: 0 !important;
}

h1 {
  max-width: 920px;
  text-wrap: balance;
  overflow-wrap: break-word;
}

span.inline-flex {
  display: inline-block !important;
  max-width: calc(100vw - 2rem);
  white-space: normal;
}

@media (max-width: 640px) {
  header img {
    height: 2.75rem !important;
    max-width: 165px !important;
  }

  h1 {
    font-size: 2rem !important;
    line-height: 1.16 !important;
  }

  .text-lg {
    font-size: 1rem !important;
    line-height: 1.75rem !important;
  }
}

@media (max-width: 380px) {
  .grid.grid-cols-2 {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

p,
li {
  color: inherit;
  overflow-wrap: break-word;
}

.grid > *,
article {
  min-width: 0;
}

section:nth-of-type(n+4) {
  background: #f6f8fb;
  color: #0f172a;
}

section:nth-of-type(4) {
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: inset 0 24px 36px rgba(15, 23, 42, 0.04);
}

section:nth-of-type(n+4) .text-white,
section:nth-of-type(n+4) .text-slate-100,
section:nth-of-type(n+4) .text-slate-200,
section:nth-of-type(n+4) .text-slate-300,
section:nth-of-type(n+4) .text-slate-400 {
  color: #0f172a !important;
}

section:nth-of-type(n+4) .bg-white\/5,
section:nth-of-type(n+4) .bg-white\/10,
section:nth-of-type(n+4) .bg-slate-900\/80,
section:nth-of-type(n+4) .bg-gradient-to-br,
section:nth-of-type(n+4) .bg-gradient-to-b,
section:nth-of-type(n+4) .bg-gradient-to-r {
  background: #ffffff !important;
}

section:nth-of-type(n+4) .border-white\/10,
section:nth-of-type(n+4) .border-white\/15,
section:nth-of-type(n+4) .border-amber-400\/20,
section:nth-of-type(n+4) .border-amber-400\/30,
section:nth-of-type(n+4) .border-amber-400\/40 {
  border-color: rgba(15, 23, 42, 0.12) !important;
}

section:nth-of-type(n+4) .text-amber-300 {
  color: #b77904 !important;
}

section:nth-of-type(n+4) .bg-amber-400,
section:nth-of-type(n+4) .hover\:bg-amber-300:hover {
  background: var(--wenait-gold) !important;
}

section:nth-of-type(n+4) .text-slate-950 {
  color: #07111f !important;
}

article,
form,
table {
  border-width: 1px;
}

ul li {
  position: relative;
  padding-left: 1.2rem;
}

ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: var(--wenait-gold);
}

input,
textarea,
select {
  color: #0f172a !important;
  background: #ffffff !important;
}

form input,
form textarea,
form select,
form label.border,
form span.border,
form .rounded-full.border {
  border: 0 !important;
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.16);
}

form input,
form textarea,
form select {
  background: rgba(255, 255, 255, 0.96) !important;
}

form label.border,
form span.border,
form .rounded-full.border {
  background: rgba(255, 255, 255, 0.07) !important;
}

form label.border:hover,
form span.border:hover,
form .rounded-full.border:hover {
  box-shadow: inset 0 0 0 1px rgba(246, 178, 26, 0.36);
}

form input:focus,
form textarea:focus,
form select:focus {
  box-shadow: inset 0 0 0 1px rgba(246, 178, 26, 0.7), 0 0 0 4px rgba(246, 178, 26, 0.12) !important;
}

.flex.flex-wrap.gap-3.text-sm > .rounded-full.border {
  border: 0 !important;
  background: rgba(255, 255, 255, 0.08) !important;
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.14);
}

input::placeholder,
textarea::placeholder {
  color: #64748b !important;
}

.wenait-note {
  border-left: 4px solid var(--wenait-gold);
  background: #fff7df;
  color: #1f2937;
  padding: 1rem 1.25rem;
  border-radius: 10px;
}

.portfolio-shot {
  border-bottom: 1px solid rgba(226, 232, 240, 0.12);
}

[data-theme="light"] .portfolio-shot {
  border-bottom-color: rgba(15, 23, 42, 0.1);
}

[data-theme="light"] body {
  background: #f6f8fb !important;
  color: #0f172a !important;
}

[data-theme="light"] body::before {
  background-image:
    linear-gradient(rgba(15,23,42,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,0.045) 1px, transparent 1px);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 46%);
}

[data-theme="light"] header {
  background: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(15, 23, 42, 0.1) !important;
  color: #0f172a !important;
}

[data-theme="light"] header img {
  background: #111827 !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.14);
}

[data-theme="light"] header nav,
[data-theme="light"] header nav a {
  color: #334155 !important;
}

[data-theme="light"] header nav a:hover {
  color: #0f172a !important;
}

[data-theme="light"] .absolute .rounded-full.blur-3xl {
  opacity: 0.16;
}

[data-theme="light"] section {
  background: #f6f8fb !important;
  color: #0f172a !important;
}

[data-theme="light"] section:first-of-type,
[data-theme="light"] section:nth-of-type(2),
[data-theme="light"] section:nth-of-type(3) {
  background: linear-gradient(180deg, #ffffff 0%, #f6f8fb 100%) !important;
}

[data-theme="light"] .text-white,
[data-theme="light"] .text-slate-100,
[data-theme="light"] .text-slate-200,
[data-theme="light"] .text-slate-300,
[data-theme="light"] .text-slate-400 {
  color: #0f172a !important;
}

[data-theme="light"] .text-amber-300 {
  color: #b77904 !important;
}

[data-theme="light"] .bg-slate-950,
[data-theme="light"] .bg-slate-950\/40,
[data-theme="light"] .bg-slate-950\/70,
[data-theme="light"] .bg-slate-950\/75,
[data-theme="light"] .bg-slate-950\/80,
[data-theme="light"] .bg-slate-900\/80,
[data-theme="light"] .bg-white\/5,
[data-theme="light"] .bg-white\/10,
[data-theme="light"] .bg-gradient-to-br,
[data-theme="light"] .bg-gradient-to-b,
[data-theme="light"] .bg-gradient-to-r {
  background: #ffffff !important;
}

[data-theme="light"] .border-white\/10,
[data-theme="light"] .border-white\/15,
[data-theme="light"] .border-amber-400\/20,
[data-theme="light"] .border-amber-400\/30,
[data-theme="light"] .border-amber-400\/40 {
  border-color: rgba(15, 23, 42, 0.12) !important;
}

[data-theme="light"] .shadow-glow,
[data-theme="light"] .shadow-soft,
[data-theme="light"] .shadow-\[0_0_60px_rgba\(251\,191\,36\,0\.12\)\] {
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.1) !important;
}

[data-theme="light"] .backdrop-blur-xl,
[data-theme="light"] .backdrop-blur-sm {
  backdrop-filter: blur(10px);
}

[data-theme="light"] .selection\:bg-amber-300::selection {
  background: #f6b21a;
}

[data-theme="light"] a.border,
[data-theme="light"] button.border {
  background: #ffffff !important;
  color: #0f172a !important;
}

[data-theme="light"] a.border:hover,
[data-theme="light"] button.border:hover,
[data-theme="light"] a.bg-white\/5:hover,
[data-theme="light"] a.bg-white\/10:hover,
[data-theme="light"] button.bg-white\/5:hover,
[data-theme="light"] button.bg-white\/10:hover {
  background: #eef2f7 !important;
  border-color: rgba(15, 23, 42, 0.22) !important;
  color: #07111f !important;
}

[data-theme="light"] a.bg-amber-400:hover,
[data-theme="light"] button.bg-amber-400:hover {
  background: #e7a40d !important;
  color: #07111f !important;
  box-shadow: 0 14px 30px rgba(183, 121, 4, 0.18);
}

[data-theme="light"] nav a:hover {
  color: #b77904 !important;
}

.theme-toggle {
  border: 1px solid rgba(226, 232, 240, 0.16);
  background: rgba(255, 255, 255, 0.06);
  color: #e2e8f0;
}

.theme-toggle:hover {
  background: rgba(255, 255, 255, 0.12);
}

.nav-quote-btn {
  background: var(--wenait-gold) !important;
  color: #07111f !important;
  border: 1px solid rgba(246, 178, 26, 0.7);
  box-shadow: 0 12px 28px rgba(246, 178, 26, 0.18);
}

.nav-quote-btn:hover {
  background: #f8c247 !important;
}

[data-theme="light"] .theme-toggle {
  border-color: rgba(15, 23, 42, 0.14);
  background: #ffffff;
  color: #0f172a;
}

[data-theme="light"] .nav-quote-btn {
  background: #07111f !important;
  color: #ffffff !important;
  border-color: #07111f;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
}

[data-theme="light"] .nav-quote-btn:hover {
  background: #132238 !important;
}