:root{
  --tcs-bg: #0b1324;
  --tcs-card: rgba(255,255,255,.06);
  --tcs-card2: rgba(255,255,255,.08);
  --tcs-border: rgba(255,255,255,.12);
  --tcs-text: rgba(255,255,255,.92);
  --tcs-muted: rgba(255,255,255,.70);
}
body{
  overflow-x:hidden;

  background: radial-gradient(1200px 600px at 20% 10%, rgba(13,110,253,.18), transparent 60%),
              radial-gradient(900px 500px at 85% 20%, rgba(111,66,193,.16), transparent 60%),
              var(--tcs-bg);
  color: var(--tcs-text);
}
a{ text-decoration:none; }
.navbar{
  backdrop-filter: blur(10px);
  background: rgba(13,110,253,.92) !important;
}
.navbar .nav-link,.navbar .navbar-brand{ color: #eaf2ff !important; }
.navbar .nav-link:hover{ color:#ffffff !important; }
.hero{ padding: 5rem 0 2.5rem; }
.hero-card{
  border: 1px solid var(--tcs-border);
  background: linear-gradient(180deg, var(--tcs-card2), var(--tcs-card));
  border-radius: 1.25rem;
  box-shadow: 0 24px 80px rgba(0,0,0,.35);
}
.kicker{ letter-spacing:.08em; text-transform:uppercase; color: rgba(234,242,255,.9); font-weight:600; font-size:.9rem; }
.display-5{ letter-spacing:-.02em; }
.lead{ color: var(--tcs-muted); }
.section{ padding: 4rem 0; }
.section-title{ letter-spacing:-.02em; margin-bottom: .5rem; }
.section-subtitle{ color: var(--tcs-muted); margin-bottom: 2rem; }
.card-soft{
  border: 1px solid var(--tcs-border);
  background: linear-gradient(180deg, var(--tcs-card2), var(--tcs-card));
  border-radius: 1.1rem;
  height: 100%;
  transition: transform .18s ease, border-color .18s ease;
}
.card-soft:hover{ transform: translateY(-4px); border-color: rgba(234,242,255,.25); }
.badge-soft{background: rgba(13,110,253,.18); border: 1px solid rgba(13,110,253,.35); color: #d9e7ff; font-size: .9rem; padding: .35rem .7rem; font-weight: 600; letter-spacing: .01em; border-radius: 999px; }
.icon-pill{
  width: 46px; height: 46px; display:inline-flex; align-items:center; justify-content:center;
  border-radius: 14px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14);
}
.hr-soft{ border-color: rgba(255,255,255,.12); opacity:1; }
.footer{ padding: 2rem 0; border-top: 1px solid rgba(255,255,255,.10); color: var(--tcs-muted); }
.lang-btn{ border: 1px solid rgba(255,255,255,.30); color:#fff; }
.lang-menu{ min-width: 220px; }
.lang-item{ display:flex; align-items:center; gap:.6rem; }
.lang-item .fi{ border-radius:4px; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.small-muted{ color: var(--tcs-muted); }
.form-control, .form-select{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
}
.form-control:focus, .form-select:focus{
  background: rgba(255,255,255,.10);
  border-color: rgba(13,110,253,.6);
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
  color: rgba(255,255,255,.92);
}
.form-control::placeholder{ color: rgba(255,255,255,.55); }
.alert-success{ background: rgba(25,135,84,.18); border-color: rgba(25,135,84,.35); color: rgba(235,255,245,.95); }

/* Fix: select options visibility in dark theme */
.form-select option{background:#0b1324;color:#ffffff;}

/* Hero equal height helpers */
.hero .hero-card img{max-width:100%;}

/* RTL support (Arabic) */
html[dir="rtl"] body { direction: rtl; text-align: right; }
html[dir="rtl"] .navbar .navbar-nav { margin-left: 0 !important; margin-right: auto !important; }
html[dir="rtl"] .ms-auto { margin-left: 0 !important; margin-right: auto !important; }
html[dir="rtl"] .text-start { text-align: right !important; }
html[dir="rtl"] .text-end { text-align: left !important; }

/* Showcase images (mobile-friendly) */
.showcase-img{
  width: 100%;
  display: block;
  border-radius: 1.25rem;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 16 / 9;
  max-height: 260px;
}
@supports not (aspect-ratio: 16 / 9){
  .showcase-img{ height: 200px; }
}
@media (max-width: 576px){
  .showcase-img{
    max-height: 200px;
  }
}


/* Brand text (desktop full, mobile short) */
.brand-logo{ width: 40px; height: 40px; border-radius: .65rem; }
.navbar-brand{ display:flex; align-items:center; gap:.75rem; min-width: 0; }
.navbar-brand .brand-text{ display:flex; align-items:center; min-width:0; }
.brand-full{ display:inline; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width: 52vw; }
.brand-short{ display:none; }
@media (max-width: 576px){
  .brand-logo{ width: 34px; height: 34px; }
  .brand-full{ display:none; }
  .brand-short{ display:inline; }
}
html[dir="rtl"] .navbar-brand{ flex-direction: row-reverse; }

/* Showcase layout tweaks (mobile) */
@media (max-width: 576px){
  .showcase-img{ max-height: 180px; }
  .showcase-card .card-body{ padding: 1rem !important; }
}


/* --- v13 tweaks: bigger soft badges + better icon/text spacing (especially RTL) --- */
.btn.btn-lg{ display: inline-flex; align-items: center; gap: .6rem; }
.btn.btn-lg .bi{ margin: 0 !important; }

.navbar-brand{ gap: .75rem !important; }
.footer-links a{ text-decoration: none; }