/* =========================================================
   Exeack — Refined Minimalist / Professional Theme
   Loaded AFTER main.css. Overrides design tokens and decor
   to deliver a clean, serious, corporate look.
   ========================================================= */

/* ----------------------------------------------------------
   Fonts — serious, professional type system
   ---------------------------------------------------------- */
:root {
  --default-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --heading-font: "Manrope", "Inter", sans-serif;
  --nav-font: "Manrope", "Inter", sans-serif;
}

/* ----------------------------------------------------------
   Light theme (default)
   ---------------------------------------------------------- */
:root,
[data-theme="light"] {
  --background-color: #ffffff;
  --default-color: #475569;
  --heading-color: #0f172a;
  --surface-color: #f8fafc;
  --contrast-color: #ffffff;
  --accent-color: #c63800;

  --nav-color: #334155;
  --nav-hover-color: #c63800;
  --nav-mobile-background-color: #ffffff;
  --nav-dropdown-background-color: #1a1a1a;
  --nav-dropdown-color: #f8fafc;
  --nav-dropdown-hover-color: #c63800;
}

[data-theme="light"] .light-background {
  --background-color: #f8fafc;
  --surface-color: #ffffff;
  --default-color: #475569;
  --heading-color: #0f172a;
}

[data-theme="light"] .dark-background {
  --background-color: #0f172a;
  --default-color: #cbd5e1;
  --heading-color: #f8fafc;
  --surface-color: #1e293b;
  --contrast-color: #ffffff;
}

/* ----------------------------------------------------------
   Dark theme
   ---------------------------------------------------------- */
[data-theme="dark"] {
  --background-color: #000000;
  --default-color: #cbd5e1;
  --heading-color: #f8fafc;
  --surface-color: #111111;
  --contrast-color: #ffffff;
  --accent-color: #c63800;

  --nav-color: #cbd5e1;
  --nav-hover-color: #c63800;
  --nav-mobile-background-color: #000000;
  --nav-dropdown-background-color: #1a1a1a;
  --nav-dropdown-color: #f8fafc;
  --nav-dropdown-hover-color: #c63800;
}

[data-theme="dark"] .light-background {
  --background-color: #111111;
  --surface-color: #1a1a1a;
}

[data-theme="dark"] .dark-background {
  --background-color: #000000;
  --default-color: #cbd5e1;
  --heading-color: #f8fafc;
  --surface-color: #111111;
}

/* ----------------------------------------------------------
   Base typography — tighter, more refined
   ---------------------------------------------------------- */
body {
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  letter-spacing: -0.02em;
  font-weight: 700;
}

.section {
  padding: 96px 0;
}

@media (max-width: 991.98px) {
  .section {
    padding: 72px 0;
  }
}

.section-title {
  padding-bottom: 56px;
}

.section-title h2 {
  font-weight: 800;
  letter-spacing: -0.03em;
}

#pricing, #team{ display:none; }
.section-title h2:before,
.section-title h2:after {
  display: none !important;
}

/* ----------------------------------------------------------
   Visual bug fixes — eliminate stray purple gradients
   ---------------------------------------------------------- */
.hero .hero-title .typed {
  background: none !important;
  -webkit-text-fill-color: var(--accent-color) !important;
  color: var(--accent-color) !important;
  background-clip: border-box !important;
}

.hero .hero-actions .action-btn.primary::before {
  display: none !important;
}

.hero .hero-actions .action-btn.primary:hover {
  background: color-mix(in srgb, var(--accent-color), #000 14%) !important;
  border-color: color-mix(in srgb, var(--accent-color), #000 14%) !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--accent-color), transparent 65%) !important;
}

/* ----------------------------------------------------------
   Refined components — calmer, more professional
   ---------------------------------------------------------- */
.btn,
.action-btn,
.cta-button,
.call-to-action .cta-buttons .btn,
.content-right .floating-card {
  border-radius: 10px !important;
}

.hero .tracking-input-group,
.hero .tracking-input-group .tracking-submit,
.hero .tracking-input-group .tracking-input {
  border-radius: 999px !important;
}

.hero .hero-actions .action-btn {
  border-radius: 10px !important;
  padding: 14px 30px;
  font-weight: 600;
}

.header{
  background:#0a0a0a;
}
.header{
  background:#0a0a0a;
}
[data-theme="light"] .header{
  background:#ffffff;
}
.scrolled .header,
.scrolled .header::before{
  background:#0a0a0a;
}
[data-theme="light"] .scrolled .header,
[data-theme="light"] .scrolled .header::before{
  background:rgba(255,255,255,0.96);
  box-shadow:0 2px 20px rgba(0,0,0,0.08);
}
[data-theme="light"] .scrolled .header{
  --nav-color:#334155;
  --nav-hover-color: #c63800;
}
.header .logo img{ filter:none; }
[data-theme="light"] .header{
  --nav-color:#334155;
  --nav-hover-color: #c63800;
  --nav-dropdown-background-color:#ffffff;
  --nav-dropdown-color:#334155;
}
[data-theme="light"] .hero{
  background:#ffffff;
}
[data-theme="light"] .hero .hero-title,
[data-theme="light"] .hero .hero-description{
  color:#0f172a;
}
.hero-welcome{ font-size:1.6rem; color:#ffffff; font-weight:800; margin:14px 0 0; }
@media (max-width:991.98px){ .hero-welcome{ font-size:1.2rem; } }
[data-theme="light"] .hero .hero-title .typed{
  -webkit-text-fill-color:#ffffff !important;
  color:#ffffff !important;
}
.hero::before,
.hero::after,
.light-orb {
  display: none;
}

.call-to-action .decoration {
  opacity: 0.6;
}

/* Crisp, consistent links & selection */
::selection {
  background: color-mix(in srgb, var(--accent-color), transparent 80%);
  color: var(--heading-color);
}

/* Push hero content lower, away from the fixed navbar */
.hero {
  padding-top: 180px;
}

/* Sweeping shine across the navbar logo.
   The logo image itself is never masked/touched — only the shine is clipped
   to the logo's alpha shape, and the bright bar moves via background-position
   so the mask stays fixed and the file's rectangular boundary is never shown. */
.header .logo {
  position: relative;
  overflow: hidden;
}

.header .logo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 35%, rgba(255, 255, 255, 0.85) 50%, transparent 65%);
  background-size: 250% 100%;
  background-repeat: no-repeat;
  -webkit-mask-image: url("../img/exeack.png");
  mask-image: url("../img/exeack.png");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  animation: logoShine 3.4s ease-in-out infinite;
  pointer-events: none;
}

@keyframes logoShine {
  0%   { background-position: 160% 0; }
  55%, 100% { background-position: -60% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .header .logo::after {
    animation: none;
    display: none;
  }
}

/* Typing cursor replaced by a moving truck */
.typed-cursor {
  display: none !important;
}

.typing-truck {
  display: inline-block;
  margin-left: 10px;
  color: var(--accent-color);
  width: 1.6em;
  height: 1em;
  vertical-align: middle;
  animation: truckDrive 1.8s ease-in-out infinite;
}

@keyframes truckDrive {
  0%   { transform: translate(-6px, 0) rotate(-3deg); }
  50%  { transform: translate(10px, -2px) rotate(3deg); }
  100% { transform: translate(-6px, 0) rotate(-3deg); }
}

@media (prefers-reduced-motion: reduce) {
  .typing-truck {
    animation: none;
  }
}

.mobile-bottom-nav{
  position:fixed; left:0; right:0; bottom:0; z-index:1045;
  display:flex; align-items:center; justify-content:space-around;
  background:color-mix(in srgb,var(--surface-color) 92%, transparent);
  backdrop-filter:blur(14px);
  border-top:1px solid color-mix(in srgb,var(--default-color),transparent 88%);
  padding:6px 8px calc(6px + env(safe-area-inset-bottom));
  box-shadow:0 -8px 24px rgba(0,0,0,0.08);
}
.mobile-bottom-nav .mnav-item{
  flex:1; display:flex; flex-direction:column; align-items:center; gap:3px;
  color:var(--default-color); text-decoration:none; font-size:0.68rem; font-weight:600;
  padding:6px 2px; border-radius:12px; transition:all 0.2s;
}
.mobile-bottom-nav .mnav-item i{ font-size:1.15rem; }
.mobile-bottom-nav .mnav-item.active{ color:var(--accent-color); }
.mobile-bottom-nav .mnav-center i{ background:var(--accent-color); color:var(--contrast-color); width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:50%; margin-bottom:1px; }
.mobile-bottom-nav .mnav-center.active i{ filter:brightness(1.05); }
.header .header-top-row{ justify-content:space-between; }
.header .header-top-row .logo{ margin-right:auto; order:1; }
.header .header-top-row .navmenu{ order:2; }
.header .header-top-row .theme-toggle{ order:3; }
.header .header-top-row .lang-switcher{ order:4; }
.lang-switcher .lang-flag{ width:28px; height:28px; border-radius:50%; object-fit:cover; border:1px solid color-mix(in srgb,var(--nav-color),transparent 70%); display:block; }
.lang-switcher .lang-label{ display:none; }
.lang-switcher .dropdown-toggle{ width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; padding:0; background:transparent; border:1px solid color-mix(in srgb,var(--nav-color),transparent 65%); }
.header, .header::before{ transition:background-color 0.45s ease, background 0.45s ease, box-shadow 0.45s ease; }
.header .logo img{ max-height:42px; }
[data-theme="light"] .header .logo img{ filter:brightness(0.88) contrast(1.05); }
@media (max-width:768px){ .header .logo img{ max-height:34px; } }
.lang-switcher .dropdown-menu{ min-width:160px; margin-top:8px; display:none; }
.lang-switcher .dropdown-menu.show{ display:block; left:50% !important; right:auto !important; transform:translateX(-50%) !important; }
.lang-switcher .dropdown-toggle::after{ display:none; }
@media (min-width:992px){ .mobile-bottom-nav{ display:none; } }
@media (max-width:991.98px){
  body{ padding-bottom:76px; font-size:12px; }
  .header{ background:var(--background-color); box-shadow:0 2px 12px rgba(0,0,0,0.06); }
  html body .hero{ padding-top:150px; }
  html body .hero .hero-wrapper{ margin-top:10px; }
  .hero .tracking-panel{ margin-top:20px; }
  .hero .tracking-input-group{ flex-wrap:wrap; background:transparent; border:0; padding:0; gap:10px; box-shadow:none; }
  .hero .tracking-input-group:focus-within{ border:0; box-shadow:none; }
  .tracking-card .tracking-input-group{ flex-wrap:wrap; background:transparent; border:0; padding:0; gap:10px; box-shadow:none; }
  .tracking-card .tracking-input-group:focus-within{ border:0; box-shadow:none; }
  .tracking-card .tracking-input-group > i{ display:none; }
  .tracking-card .tracking-input-group .tracking-input{ flex:1 1 100%; background:var(--background-color); border:1px solid color-mix(in srgb,var(--default-color),transparent 80%); border-radius:999px; padding:12px 16px; font-size:13px; width:100%; transition:border-color 0.2s, box-shadow 0.2s; }
  .tracking-card .tracking-input-group .tracking-input:focus{ border-color:var(--accent-color); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-color),transparent 85%); outline:0; }
  .tracking-card .tracking-input-group .tracking-submit{ width:100%; justify-content:center; border-radius:999px; padding:10px 16px; font-size:13px; }
  .hero .tracking-input-group > i{ display:none; }
  .hero .tracking-input-group .tracking-input{ flex:1 1 100%; background:var(--background-color); border:1px solid color-mix(in srgb,var(--default-color),transparent 80%); border-radius:999px; padding:12px 16px; font-size:13px; width:100%; transition:border-color 0.2s, box-shadow 0.2s; }
  .hero .tracking-input-group .tracking-input:focus{ border-color:var(--accent-color); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-color),transparent 85%); outline:0; }
  .hero .tracking-input-group .tracking-submit{ width:100%; justify-content:center; border-radius:999px; padding:10px 16px; font-size:13px; gap:6px; }
  .section{ padding:40px 0; }
  .section-title{ padding-bottom:24px; }
  .section-title h2{ font-size:20px; }
  .hero .hero-title{ font-size:22px; }
  h3{ font-size:16px; }
  .features .features-grid{ grid-template-columns:1fr; gap:12px; margin-top:24px; }
  .features .feature-item{ padding:18px 16px; }
  .features .feature-item .feature-number{ font-size:26px; top:14px; right:16px; }
  .features .feature-item .feature-icon{ margin-bottom:14px; margin-left:2px; }
  .features .feature-item .feature-icon i{ width:48px; height:48px; font-size:20px; }
  .features .feature-item h4{ font-size:0.65rem; margin-bottom:4px; }
  .features .feature-item p{ font-size:0.58rem; line-height:1.3; margin-bottom:6px; }
  .features .feature-item .feature-tags .tag{ font-size:0.55rem; padding:3px 7px; }
  .about .features-list .feature-item{ padding:14px; text-align:center; }
  .about .features-list .feature-item i{ font-size:1.4rem; }
  .about .features-list .feature-item h5{ font-size:0.9rem; }
  .about .features-list .feature-item p{ font-size:0.78rem; }
  .container{ padding-left:28px; padding-right:28px; }
  .lang-switcher .dropdown-menu.show{ left:auto !important; right:8px !important; transform:none !important; }
  .scroll-top, .scroll-top.active{ bottom:105px; right:16px; left:auto; }
  #navmenu, .navmenu, .mobile-nav-toggle{ display:none; }
  .header .header-top-row{ justify-content:flex-start; }
}
