/* Fargo Tercüme — only additions for the bilingual site and client references.
   Original colors, typography, section layout and animated illustration are untouched. */
/* Desktop menu language selection: readable on original dark navy navigation. */
.site-nav .fargo-lang-switch{
  display:inline-flex;align-items:center;justify-content:center;gap:3px;
  white-space:nowrap;margin-left:0;padding-left:12px;
  border-left:1px solid rgba(255,255,255,.23);
  font-size:12px;font-weight:800;letter-spacing:.025em;line-height:1;
}
.site-nav .fargo-lang-switch a{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:28px;min-height:30px;padding:6px 4px;
  text-decoration:none;color:#c4d9ed;opacity:1;
  border-radius:4px;transition:color .2s ease,background-color .2s ease;
}
.site-nav .fargo-lang-switch a.is-active{color:#fff;background:#1764a2}
.site-nav .fargo-lang-switch a:hover{color:#fff;background:rgba(255,255,255,.14)}
.site-nav .fargo-lang-switch span{color:#547a99}
/* Always-visible compact TR/EN selector next to the mobile menu toggle. */
.fargo-mobile-lang{display:none}
/* The references are positioned just above the existing contact area. */
.fargo-references{background:#fff}
.fargo-references-grid{
  list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  border:1px solid #dae4ed;border-radius:9px;overflow:hidden;margin:29px 0 0;padding:0;
  background:#fff;
}
.fargo-reference{
  display:flex;align-items:center;justify-content:center;min-width:0;min-height:111px;
  padding:18px 11px;text-align:center;border-right:1px solid #dae4ed;
  color:#244359;font-weight:750;letter-spacing:-.03em;
  transition:background-color .2s ease,color .2s ease;
}
.fargo-reference:last-child{border-right:0}
.fargo-reference:hover{background:#f4f8fb;color:#092441}
.fargo-reference-abb{font-size:30px;letter-spacing:-.07em;font-weight:900}
.fargo-reference-accelleron{font-size:clamp(13px,1.55vw,20px);font-weight:700}
.fargo-reference-hitachi{font-size:clamp(13px,1.5vw,20px);font-weight:850;letter-spacing:0}
.fargo-reference-solartoday{font-size:clamp(11px,1.3vw,17px);letter-spacing:0}
.fargo-reference-solaredge{font-size:clamp(13px,1.5vw,20px);font-weight:750}
.fargo-reference-dot{color:#176ec5}
@media (prefers-reduced-motion:no-preference){
 .fargo-reference.is-visible{animation:fargo-ref-rise .48s ease-out both;animation-delay:var(--fargo-delay,0ms)}
 @keyframes fargo-ref-rise{from{opacity:.45;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
}
/* English copy is longer; keep the same THREE-line heading and layout. */
html[lang="en"] .hero h1{font-size:clamp(38px,4.4vw,56px);letter-spacing:-1.8px}
@media(max-width:1070px) and (min-width:781px){
  .header-inner{gap:10px}
  .site-nav{gap:clamp(7px,1vw,14px)}
  .site-nav a{font-size:11px}
  .site-nav .fargo-lang-switch{padding-left:7px}
}
@media(max-width:780px){
  .fargo-mobile-lang{display:inline-flex;align-items:center;gap:3px;margin-left:auto;margin-right:2px;
    font-weight:800;font-size:12px;letter-spacing:.02em;color:#829eb7}
  .fargo-mobile-lang a{color:#b9d1e8;padding:7px 6px;border-radius:4px;min-width:31px;text-align:center;text-decoration:none}
  .fargo-mobile-lang a.is-active{color:white;background:#1764a2}
  .fargo-mobile-lang a:hover{color:white}
  .site-nav .fargo-lang-switch{display:none}
  .fargo-references-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fargo-reference:nth-child(3){border-right:0}
  .fargo-reference:nth-child(n+4){border-top:1px solid #dae4ed}
}
@media(max-width:520px){
  .fargo-references-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fargo-reference{min-height:92px;padding:14px 9px;font-size:15px}
  .fargo-reference:nth-child(3){border-right:1px solid #dae4ed}
  .fargo-reference:nth-child(2n){border-right:0}
  .fargo-reference:nth-child(n+3){border-top:1px solid #dae4ed}
  .fargo-reference:last-child{grid-column:1/-1}
  .fargo-reference-abb{font-size:27px}
  .fargo-reference-accelleron,.fargo-reference-hitachi,.fargo-reference-solaredge{font-size:17px}
  .fargo-reference-solartoday{font-size:15px}
  html[lang="en"] .hero h1{font-size:clamp(27px,8.4vw,44px);letter-spacing:-1.4px}
}
@media(prefers-reduced-motion:reduce){.fargo-reference,.fargo-mobile-lang a{transition:none!important;animation:none!important}}

/* Header email shortcut: positioned directly after TR/EN without altering the approved layout. */
.site-nav .fargo-email-desktop,
.fargo-email-mobile{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;min-width:36px;flex-shrink:0;
  border:1px solid rgba(181,211,239,.36);border-radius:7px;
  background:rgba(255,255,255,.06);color:#dcebf8;text-decoration:none;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease;
}
.site-nav .fargo-email-desktop{margin-left:-7px}
.fargo-email-link svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.site-nav .fargo-email-desktop:hover,.fargo-email-mobile:hover{
  color:#fff;background:#1764a2;border-color:#5b9dcc;
}
.fargo-email-mobile{display:none}
@media(max-width:780px){
 .site-nav .fargo-email-desktop{display:none}
 .fargo-email-mobile{display:inline-flex;margin-right:0}
 .header-inner{gap:12px}
}
@media(max-width:370px){
 .header-inner{gap:7px}
 .fargo-mobile-lang{gap:1px;margin-right:0}
 .fargo-mobile-lang a{min-width:26px;padding:6px 3px}
 .fargo-email-mobile{width:32px;height:32px;min-width:32px}
 .menu-toggle{padding:7px}
 .brand-subtitle{letter-spacing:2.3px}
}
@media(prefers-reduced-motion:reduce){.fargo-email-link{transition:none}}

/* Keep the approved desktop navigation on very narrow tablets without horizontal scrolling. */
@media(min-width:781px) and (max-width:900px){
 .header-inner{gap:5px}
 .site-nav{gap:4px}
 .site-nav .nav-cta{padding:10px 11px}
 .site-nav .fargo-lang-switch{padding-left:4px}
 .site-nav .fargo-email-desktop{margin-left:0;width:32px;min-width:32px;height:32px}
}

/* Fargo original full logo (wordmark + embedded Translation Services line).
   Compact sizing keeps the artwork entirely inside the existing header. */
.site-header .header-inner > a.brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 0;
  margin-right: auto;
  line-height: 0;
}
.site-header .brand-logo {
  display: block;
  width: 150px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
.site-footer .brand-footer {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.site-footer .brand-footer .brand-logo {
  display: block;
  width: 135px;
  height: auto;
  object-fit: contain;
}
@media (max-width: 1050px) {
  .site-header .brand-logo {width: 142px;}
}
@media (max-width: 780px) {
  .site-header .brand-logo {width: 132px;}
}
@media (max-width: 370px) {
  .site-header .brand-logo {width: 116px;}
}