/* Tankio brand system — September 2026 */
:root {
  --tankio-blue: #2563EB;
  --tankio-navy: #1E3A8A;
  --tankio-water: #60A5FA;
  --tankio-sky: #DBEAFE;
  --tankio-white: #FFFFFF;
  --tankio-ink: #172554;
  --tankio-muted: #314b73;
  --tankio-link: #1D4ED8;
}

html { background: var(--tankio-sky); }
body {
  background: var(--tankio-sky) !important;
  color: var(--tankio-ink) !important;
  font-family: Outfit, Inter, sans-serif !important;
}

.kinetic-bg {
  background:
    radial-gradient(circle at 8% 0%, rgba(96, 165, 250, .38), transparent 34rem),
    radial-gradient(circle at 95% 15%, rgba(37, 99, 235, .16), transparent 38rem),
    var(--tankio-sky) !important;
}

.heading-display, .font-headline { color: var(--tankio-navy); }
.text-readable-variant { color: var(--tankio-muted) !important; }
.text-on-surface, .text-on-background { color: var(--tankio-ink) !important; }
.text-primary, .text-cta-blue { color: var(--tankio-link) !important; }
.text-primary\/70, .text-primary\/80, .text-\[\#4d8eff\], .text-blue-300 { color: var(--tankio-link) !important; }
.text-on-surface\/80 { color: var(--tankio-ink) !important; }
.text-readable-variant\/60, .text-outline { color: var(--tankio-muted) !important; }
.text-yellow-400 { color: #92400e !important; }
.blue-gradient-text {
  background: linear-gradient(115deg, var(--tankio-navy), #1D4ED8) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

header.bg-\[\#0c0e14\]\/90 {
  background: rgba(255,255,255,.9) !important;
  border-color: rgba(30,58,138,.12) !important;
  box-shadow: 0 8px 28px rgba(30,58,138,.10) !important;
}
header .text-white, header .text-\[\#f0f1f7\] { color: var(--tankio-navy) !important; }
header .hover\:text-white:hover { color: var(--tankio-blue) !important; }
.bg-surface-container-high { background-color: var(--tankio-white) !important; }

.glass-panel {
  background: var(--tankio-white) !important;
  border-color: rgba(37,99,235,.14) !important;
  box-shadow: 0 14px 38px rgba(30,58,138,.09) !important;
}
.glass-panel:hover { border-color: rgba(37,99,235,.32) !important; }

.btn-primary, .btn-blue {
  background: var(--tankio-blue) !important;
  color: var(--tankio-white) !important;
  border-color: var(--tankio-blue) !important;
  border-radius: .65rem !important;
  box-shadow: 0 8px 18px rgba(37,99,235,.22) !important;
}
.btn-primary:hover, .btn-blue:hover {
  background: var(--tankio-navy) !important;
  box-shadow: 0 11px 22px rgba(30,58,138,.25) !important;
}

.bg-surface-container-lowest, .bg-surface-container-low, .bg-surface-container,
.bg-surface-container-high, .bg-surface-container-highest, .bg-background {
  background-color: var(--tankio-white) !important;
}
.bg-surface-container-high\/40 { background-color: var(--tankio-white) !important; }
.bg-surface-container-low\/30, .bg-surface-container-low\/50, .bg-surface-container\/30 {
  background-color: #EFF6FF !important;
}
.bg-primary, .bg-\[\#4d8eff\] { background-color: var(--tankio-blue) !important; }
.bg-primary.text-white, .bg-\[\#4d8eff\].text-white { color: var(--tankio-white) !important; }
.bg-black\/40, .bg-black\/30 { background-color: #EFF6FF !important; }
.bg-white\/5, .bg-white\/10 { background-color: rgba(37,99,235,.06) !important; }
.border-white\/5, .border-white\/10 { border-color: rgba(30,58,138,.12) !important; }
.border-l-4.border-on-surface\/20,
.border-l-4.border-primary,
.border-l-4.border-primary\/60,
.border-l-4.border-cta-blue { border-left-color: var(--tankio-blue) !important; }
.text-white, .text-\[\#f0f1f7\] { color: var(--tankio-ink) !important; }

footer.bg-\[\#050608\] {
  background: var(--tankio-navy) !important;
  color: var(--tankio-white) !important;
  border-color: rgba(255,255,255,.16) !important;
}
footer .text-\[\#f0f1f7\], footer .text-white { color: var(--tankio-white) !important; }
footer .text-readable-variant, footer .text-readable-variant\/60 { color: #c7dafe !important; }

::selection { background: var(--tankio-water); color: var(--tankio-navy); }

.language-switcher { position: relative; font-family: Inter, sans-serif; }
.language-switcher__button {
  display: inline-flex; align-items: center; gap: .35rem; padding: .55rem .65rem;
  color: var(--tankio-navy); background: #eff6ff; border: 1px solid #bfdbfe;
  border-radius: .55rem; font-size: .75rem; font-weight: 800; letter-spacing: .06em;
}
.language-switcher__button:hover, .language-switcher.is-open .language-switcher__button { background: #dbeafe; }
.language-switcher__button .material-symbols-outlined { font-size: 1.05rem; }
.language-switcher__menu {
  display: none; position: absolute; right: 0; top: calc(100% + .5rem); z-index: 80;
  min-width: 9rem; overflow: hidden; background: #fff; border: 1px solid #bfdbfe;
  border-radius: .6rem; box-shadow: 0 12px 26px rgba(30,58,138,.16);
}
.language-switcher.is-open .language-switcher__menu { display: block; }
.language-switcher__menu a { display: block; padding: .65rem .8rem; color: var(--tankio-ink); font-size: .82rem; font-weight: 600; }
.language-switcher__menu a:hover, .language-switcher__menu a[aria-current="page"] { background: #dbeafe; color: var(--tankio-navy); }
.language-switcher a:focus-visible, .language-switcher button:focus-visible {
  outline: 3px solid var(--tankio-blue); outline-offset: 2px;
}
.contact-feedback { border: 1px solid; border-radius: .5rem; padding: .75rem 1rem; font-size: .875rem; }
.contact-feedback--success { background: #f0fdf4; border-color: #15803d; color: #166534; }
.contact-feedback--error { background: #fef2f2; border-color: #b91c1c; color: #991b1b; }