/* English-specific refinements: retain the same brand colors and both themes. */
html[lang="en"] body{font-family:Inter,"Segoe UI",Arial,sans-serif;letter-spacing:-.01em}
html[lang="en"] .site-nav{gap:clamp(11px,1.35vw,24px)}
html[lang="en"] .site-nav > a, html[lang="en"] .site-nav .nav-link{font-size:clamp(11px,.83vw,14px);font-weight:750}
html[lang="en"] .mega-menu,html[lang="en"] .mega-col a{direction:ltr;text-align:left}
html[lang="en"] .mega-col a{flex-direction:row;justify-content:flex-start}
html[lang="en"] .mega-col h4,html[lang="en"] .mega-intro,html[lang="en"] .mega-intro h3,html[lang="en"] .mega-kicker{text-align:left;direction:ltr}
html[lang="en"] .mega-col h4::after{inset-inline-start:0}
html[lang="en"] .mega-col a:hover{transform:translateX(2px)}
html[lang="en"] .mega-intro{direction:ltr}
html[lang="en"] .mega-intro h3{font-size:17px}
html[lang="en"] .mega-col a{font-size:11px;line-height:1.5}
html[lang="en"] .nav-button{font-size:11px}
html[lang="en"] .hero-copy{margin-inline-start:auto;margin-inline-end:0;text-align:left;max-width:535px}
html[lang="en"] .hero .eyebrow{justify-content:flex-start}
html[lang="en"] .hero h1{letter-spacing:-1.8px;line-height:1.17;font-size:clamp(43px,4.8vw,70px)}
html[lang="en"] .hero p{font-size:15px;line-height:1.9}
html[lang="en"] .hero-buttons{justify-content:flex-start}
html[lang="en"] .section h2{line-height:1.28;letter-spacing:-.7px}
html[lang="en"] .section-heading p,html[lang="en"] .about-copy>p{line-height:1.8}
html[lang="en"] .service-card{min-height:215px}
html[lang="en"] .service-card h3{line-height:1.45}
html[lang="en"] .service-card p{line-height:1.7}
html[lang="en"] .about-photo-label{direction:ltr;justify-content:space-between}
html[lang="en"] .about-photo-label strong{order:0}
html[lang="en"] .about-photo-label span{order:1;flex:1;max-width:none;margin-inline-start:0;padding-inline-start:0;text-align:right;white-space:normal}
html[lang="en"] .project-caption{text-align:left}
html[lang="en"] .process-card:not(:last-child)::after{content:'→';left:auto;right:-24px;transform:translate(50%,-50%)}
html[lang="en"] .testimonial-feature figcaption{text-align:left}
html[lang="en"] .testimonials-section .testimonial-feature figcaption{text-align:left}
html[lang="en"] .faq-intro{text-align:left}
html[lang="en"] .consultation-copy{text-align:left}
html[lang="en"] .consultation-field,html[lang="en"] .consultation-times{text-align:left}
html[lang="en"] .consultation-input>svg{left:13px;right:auto}
html[lang="en"] .consultation-input input,html[lang="en"] .consultation-input textarea{padding:9px 13px 9px 40px;text-align:left}
html[lang="en"] .consultation-input input[dir="ltr"]{text-align:left}
html[lang="en"] .consult-date-input input{text-align:left}
html[lang="en"] .consultation-phone-row{grid-template-columns:minmax(0,1fr) 125px}
html[lang="en"] .consultation-panel::after{left:-155px;right:auto}
html[lang="en"] .consultation-submit svg{transform:none}
html[lang="en"] .footer{text-align:left}
html[lang="en"] .mobile-language-switch{text-align:left}
/* language control available in mobile menu in both locales */
@media (max-width:1150px) and (min-width:881px){
 html[lang="en"] .nav-inner{gap:10px;padding-inline:12px}
 html[lang="en"] .site-nav{gap:12px}
 html[lang="en"] .site-nav > a,html[lang="en"] .site-nav .nav-link{font-size:11px}
 html[lang="en"] .theme-switch{min-width:80px;padding:0 8px}
 html[lang="en"] .language-switch{padding-inline:10px}
 html[lang="en"] .nav-button{font-size:10px;padding:0 8px}
}
@media(min-width:881px){
 html[lang="en"] .mega-menu{left:0;right:auto;inset-inline-end:auto}
 html[lang="en"] .mega-menu::before{left:34px;right:auto}
}
@media(max-width:880px){
 html[lang="en"] .hero-copy{margin:0 auto;text-align:center}
 html[lang="en"] .hero .eyebrow,html[lang="en"] .hero-buttons{justify-content:center}
 html[lang="en"] .site-nav .nav-link{text-align:left}
 html[lang="en"] .site-nav .mega-menu{left:auto;right:auto}
 html[lang="en"] .process-card:not(:last-child)::after{display:none}
}
@media(max-width:650px){
 html[lang="en"] .hero h1{font-size:clamp(34px,10vw,48px)}
 html[lang="en"] .section h2{font-size:clamp(24px,6.3vw,30px)}
 html[lang="en"] .about-photo-label span{font-size:9px}
 html[lang="en"] .consultation-phone-row{grid-template-columns:minmax(0,1fr) 98px}
 html[lang="en"] .consultation-form-heading h3{font-size:15px}
}


/* V51: keep English form inputs and country code in natural LTR visual order.
   Existing DOM order is phone input then country selector; RTL grid direction
   places the selector to the left without changing form control identity. */
html[lang="en"] .consultation-phone-row{direction:rtl}
html[lang="en"] .consultation-phone-row > *{direction:ltr}
html[lang="en"] .consultation-phone-row .consult-phone-input{direction:ltr}
html[lang="en"] .consultation-phone-row select{direction:ltr}


/* V52 — mirror English hero composition: copy left, image focus right */
html[lang="en"] .hero-copy{
  margin-inline-start:0;
  margin-inline-end:auto;
  text-align:left;
}
html[lang="en"] .hero-bg{
  background-position:right center;
}
html[lang="en"] .hero-wash{
  background:linear-gradient(90deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.86) 22%,rgba(255,255,255,.48) 40%,rgba(255,255,255,.12) 56%,rgba(255,255,255,0) 68%);
}
html[data-theme="dark"][lang="en"] .hero-wash{
  background:linear-gradient(90deg,rgba(7,20,39,.94) 0%,rgba(7,20,39,.88) 22%,rgba(7,20,39,.52) 42%,rgba(7,20,39,.16) 58%,rgba(7,20,39,0) 70%);
}

@media(max-width:880px){
  html[lang="en"] .hero-bg{background-position:72% center;}
  html[lang="en"] .hero-copy{margin:0 auto;text-align:center;}
}
@media(max-width:650px){
  html[lang="en"] .hero-bg{background-position:68% center;}
  html[lang="en"] .hero-wash{background:linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,.90) 23%,rgba(255,255,255,.95) 66%,rgba(255,255,255,.16));}
  html[data-theme="dark"][lang="en"] .hero-wash{background:linear-gradient(180deg,rgba(6,18,35,.70),rgba(6,18,35,.96) 28%,rgba(6,18,35,.96) 68%,rgba(6,18,35,.30));}
}


/* V53 — use an actually mirrored hero image for English */
html[lang="en"] .hero-bg{background-image:url('assets/hero-light-flipped.webp');background-position:right center;}
@media(max-width:880px){html[lang="en"] .hero-bg{background-position:74% center;}}
@media(max-width:650px){html[lang="en"] .hero-bg{background-position:70% center;}}


/* V61 — flip the actual dark video composition for LTR: skyline on right. */
html[lang="en"][data-theme="dark"] .hero .hero-video{
  transform:scaleX(-1);
}
html[lang="en"][data-theme="dark"] .hero .hero-wash{
  background:linear-gradient(90deg,rgba(7,20,39,.77),rgba(7,20,39,.62) 22%,rgba(7,20,39,.26) 42%,rgba(7,20,39,.06) 63%,rgba(7,20,39,0) 78%);
}
@media(max-width:880px){
  html[lang="en"][data-theme="dark"] .hero .hero-wash{
    background:linear-gradient(90deg,rgba(7,20,39,.87),rgba(7,20,39,.73) 37%,rgba(7,20,39,.20) 78%);
  }
}
@media(max-width:650px){
  html[lang="en"][data-theme="dark"] .hero .hero-wash{
    background:linear-gradient(180deg,rgba(6,18,35,.64),rgba(6,18,35,.85) 28%,rgba(6,18,35,.89) 70%,rgba(6,18,35,.32));
  }
}