/* Barber Flow strict visual lockup.
   The Nabil customer page is the 1:1 positional reference.
   IMPORTANT: the barber symbol belongs ONLY to this small upper-left brand lockup. */
.customer-logo.dynamic-brand{
  position:relative!important;
  display:block!important;
  width:clamp(164px,54vw,208px)!important;
  max-width:58vw!important;
  aspect-ratio:2153 / 730!important;
  height:auto!important;
  flex:0 0 auto!important;
  margin-top:1px!important;
  overflow:visible!important;
  line-height:1!important;
  text-decoration:none!important;
  mix-blend-mode:normal!important;
  background:transparent!important;
}
.customer-logo.dynamic-brand .brand-symbol-layer{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:22.30%!important;   /* 480 / 2153 */
  height:100%!important;
  display:block!important;
  background:url("assets/barber-symbol.png") 0 0 / 100% 100% no-repeat!important;
  pointer-events:none!important;
}
.customer-logo.dynamic-brand .brand-owner{
  position:absolute!important;
  left:25.27%!important;    /* 544 / 2153 */
  top:31.5%!important;
  width:71.6%!important;
  height:34%!important;
  display:flex!important;
  align-items:center!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:clamp(17px,5.45vw,22px)!important;
  font-weight:500!important;
  letter-spacing:-.035em!important;
  color:#efc875!important;
  text-shadow:0 0 .5px #6f4b16!important;
  transform-origin:left center!important;
  pointer-events:none!important;
}
.customer-logo.dynamic-brand .brand-studio{
  position:absolute!important;
  left:25.27%!important;
  top:68.6%!important;
  width:71.6%!important;
  height:16%!important;
  display:flex!important;
  align-items:flex-start!important;
  white-space:nowrap!important;
  overflow:visible!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:clamp(6.7px,2.05vw,8.7px)!important;
  font-weight:500!important;
  letter-spacing:.31em!important;
  color:#efc875!important;
  pointer-events:none!important;
}
/* Never let generic logo-image rules affect the symbol: it is a background layer, not an <img>. */
.customer-logo.dynamic-brand img{display:none!important}
/* No customer photo means an actually empty hero image layer. Never use a logo/icon as fallback. */
.hero-photo:not(.has-photo){background-color:#07090a!important;background-image:none!important}
.hero-photo:not(.has-photo) img{display:none!important}
.hero-photo:not(.has-photo) .photo-label{display:none!important}
/* Original Nabil positioning remains: branding upper-left, hamburger upper-right. */
@media(max-width:390px){
  .customer-logo.dynamic-brand{width:158px!important;max-width:55vw!important}
  .customer-logo.dynamic-brand .brand-owner{font-size:17px!important}
  .customer-logo.dynamic-brand .brand-studio{font-size:6.7px!important}
}
@media(max-height:740px) and (max-width:699px){
  .customer-logo.dynamic-brand{width:150px!important}
  .customer-logo.dynamic-brand .brand-owner{font-size:16px!important}
  .customer-logo.dynamic-brand .brand-studio{font-size:6.35px!important}
}
@media(min-width:700px){
  .customer-logo.dynamic-brand{width:225.25px!important;max-width:none!important}
  .customer-logo.dynamic-brand .brand-owner{font-size:23.5px!important}
  .customer-logo.dynamic-brand .brand-studio{font-size:9.2px!important}
}
body.booking-mode .customer-logo.dynamic-brand{width:157.25px!important;max-width:54%!important}
