/* DECT / 2026.10.25 – Brand polish, mobile-safe, layered after original site CSS. */
/* Restrained frosted glass. Retain brand colours, contrast and existing mobile header layout. */
.header {
  position: sticky !important;
  top: 0;
  z-index: 60;
  background: rgba(247,245,239,.78) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
  border-bottom: 1px solid rgba(88,73,53,.15) !important;
  box-shadow: 0 7px 32px rgba(19,22,27,.055) !important;
}
.header .language-switch {
  background: rgba(255,255,255,.34) !important;
  border: 1px solid rgba(79,73,62,.19) !important;
  border-radius: 999px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.header .language-switch a {transition: background-color .22s ease, color .22s ease}
.header .brand:focus-visible,.header .language-switch a:focus-visible,
.footer a:focus-visible,.studio-intro-link:focus-visible {
 outline: 2px solid #ae854b; outline-offset: 4px; border-radius: 3px;
}
/* Header and footer use the exact official DECT lettermark assets; light logo variant on dark footer. */
.footer-brand {display: inline-flex; align-items: center; min-height: 45px; font-size: 0 !important; letter-spacing: 0 !important}
.footer-brand img {display:block; width:168px; height:auto; max-height:44px; object-fit:contain; object-position:left center}
[dir="rtl"] .footer-brand img {object-position:right center}
/* The About/Approach area gets genuinely balanced, scannable columns, in FR / EN / AR. */
section.statement {
  display: grid !important;
  grid-template-columns: minmax(0,1.12fr) minmax(0,.88fr) !important;
  column-gap: clamp(30px,6vw,100px) !important;
  row-gap: clamp(25px,3.5vw,48px) !important;
  align-items: start;
  padding-top: clamp(75px,8vw,122px) !important;
  padding-bottom: clamp(75px,8vw,122px) !important;
}
section.statement::after {display: none !important}
section.statement > .eyebrow {grid-column: 1 / -1; margin:0; line-height:1.4}
section.statement > h2 {grid-column:1 !important; margin:0 !important; max-width:720px; line-height:1.13}
section.statement > .statement-bottom {
  grid-column:2 !important; display:flex !important; flex-direction:column;
  align-items:flex-start; justify-content:center; align-self:center;
  gap:26px; padding-top:12px;
}
section.statement > .statement-bottom p {
  max-width:445px; font-size:clamp(1rem,1.24vw,1.15rem); line-height:1.85;
  color:#595348 !important; margin:0;
}
section.statement > .statement-bottom a {margin:0; color:#302b24}
section.statement > .credibility {
  grid-column: 1 / -1 !important;
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  column-gap:clamp(30px,6vw,100px);
  row-gap:20px;
  border-top:1px solid rgba(91,77,57,.26) !important;
  margin:clamp(20px,3vw,44px) 0 0;
  padding:clamp(32px,4vw,57px) 0 0;
}
section.statement > .credibility h3 {
  margin:12px 0 0;
  max-width:650px;
  font-size:clamp(1.7rem,3vw,3.05rem);
  line-height:1.2;
}
section.statement > .credibility > p {
  align-self:center; max-width:450px; font-size:clamp(.97rem,1.15vw,1.1rem);
  line-height:1.8; margin:0; color:#595348 !important;
}
/* A subtle studio-introduction link in the existing homepage, without displacing the moving hero. */
.studio-intro-inner .studio-intro-link {
  grid-column:2;
  width:max-content;
  max-width:100%;
  display:inline-flex;
  color:#69543a;
  text-decoration:none;
  border-bottom:1px solid rgba(126,101,69,.48);
  padding:7px 0 10px;
  margin-top:-30px;
  font-weight:600;
  font-size:.82rem;
  letter-spacing:.025em;
  transition:color .2s,border-color .2s;
}
.studio-intro-link:hover {color:#241d15;border-color:#241d15}
@media (max-width:850px) {
 section.statement {grid-template-columns:1fr !important;row-gap:26px !important}
 section.statement > .eyebrow,section.statement > h2,section.statement > .statement-bottom,
 section.statement > .credibility {grid-column:1 !important}
 section.statement > .statement-bottom {padding:0 !important;align-self:start;gap:15px}
 section.statement > .credibility {grid-template-columns:1fr;row-gap:16px}
 .studio-intro-inner .studio-intro-link {grid-column:1;margin-top:4px}
}
@media (max-width:550px) {
 .header {-webkit-backdrop-filter:blur(11px) saturate(115%)!important;backdrop-filter:blur(11px) saturate(115%)!important}
 .footer-brand img {width:150px}
 section.statement {padding-inline:21px !important;padding-block:70px !important}
 section.statement > h2 {font-size:clamp(2.45rem,10vw,4.1rem) !important}
 section.statement > .credibility {margin-top:17px}
}
/* Last homepage CTA: balanced invitation and action instead of all content on one edge. */
.contact-band .contact-band-inner {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:clamp(24px,6vw,100px) !important;
}
.contact-band .contact-band-inner > div {min-width:0}
.contact-band .contact-band-inner h2 {max-width:720px}
.contact-band .contact-band-inner > .button {justify-self:end;width:auto}
@media (max-width:730px) {
 .contact-band .contact-band-inner {grid-template-columns:1fr !important;gap:28px !important}
 .contact-band .contact-band-inner > .button {justify-self:start;max-width:100%}
}
