/* Barberium · site do cliente · abertura (etapa 7h, parte 1).
   Antes injetado por JavaScript pelo remendo barberium-client-v12.24.js (v12.43, v12.47 e v12.44). */

/* Capa invisível até a foto certa carregar (cliente/marca.js) */
.hero-bg{
  transition:opacity .20s ease!important;
}
html.barberium-hero-pending .hero-bg{
  opacity:0!important;
}

/* Tela de manutenção (cliente/marca.js) */
body.barberium-maintenance-active{
  overflow:hidden!important;
  background:#020704!important;
}

body.barberium-maintenance-active .app-shell{
  display:none!important;
}

#barberiumMaintenance{
  position:fixed;
  inset:0;
  z-index:9998;
  display:grid;
  place-items:center;
  overflow:auto;
  padding:
    calc(34px + env(safe-area-inset-top))
    24px
    calc(34px + env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 50% 22%,rgba(202,160,73,.09),transparent 31%),
    radial-gradient(circle at 50% 110%,rgba(24,77,51,.22),transparent 42%),
    #020704;
  color:#f3ead7;
  text-align:center;
}

.v1247-maintenance-card{
  width:min(100%,520px);
  display:flex;
  flex-direction:column;
  align-items:center;
}

.v1247-maintenance-logo{
  width:104px;
  height:104px;
  object-fit:contain;
  margin-bottom:25px;
  filter:drop-shadow(0 14px 34px rgba(0,0,0,.42));
  animation:v1247LogoIn .65s cubic-bezier(.18,.82,.25,1) both;
}

.v1247-maintenance-line{
  width:58px;
  height:1px;
  margin:0 auto 24px;
  background:linear-gradient(90deg,transparent,#dfb95f,transparent);
  opacity:.85;
}

.v1247-maintenance-kicker{
  margin:0 0 10px;
  color:#d6ae5b;
  font:800 11px/1.3 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.22em;
  text-transform:uppercase;
}

.v1247-maintenance-card h1{
  margin:0;
  max-width:470px;
  color:#f3ead7;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(34px,9vw,53px);
  line-height:1.02;
  font-weight:700;
  letter-spacing:-.025em;
}

.v1247-maintenance-copy{
  max-width:430px;
  margin:20px auto 0;
  color:#aea692;
  font:500 15px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.v1247-maintenance-unit{
  margin:12px 0 0;
  color:#716b5f;
  font:700 10px/1.3 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.v1247-maintenance-actions{
  width:100%;
  max-width:360px;
  margin-top:30px;
}

.v1247-maintenance-wa{
  min-height:54px;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid rgba(226,186,99,.32);
  border-radius:16px;
  background:linear-gradient(135deg,#d6ae5b,#e5c477);
  color:#102016;
  text-decoration:none;
  font:800 14px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  box-shadow:0 12px 30px rgba(214,174,91,.14);
}

.v1247-maintenance-foot{
  margin-top:38px;
  color:#49473f;
  font:600 10px/1.3 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.07em;
}

@keyframes v1247LogoIn{
  0%{opacity:0;transform:translateY(10px) scale(.94)}
  100%{opacity:1;transform:none}
}

@media(prefers-reduced-motion:reduce){
  .v1247-maintenance-logo{animation:none}
}

/* Entrada animada da capa (cliente/capa.js) */
@keyframes v1244LogoEnter{
  0%{opacity:0;transform:translateY(12px) scale(.92);filter:blur(2px)}
  68%{opacity:1;transform:translateY(-2px) scale(1.018);filter:blur(0)}
  100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}

@keyframes v1244LineDraw{
  0%{opacity:0;transform:scaleX(0)}
  25%{opacity:.9}
  100%{opacity:.72;transform:scaleX(1)}
}

@keyframes v1244CopyIn{
  0%{opacity:0;transform:translateY(15px);filter:blur(1.5px)}
  100%{opacity:1;transform:translateY(0);filter:blur(0)}
}

@keyframes v1244Breathe{
  0%,20%,100%{transform:scale(1)}
  43%{transform:scale(1.022)}
  58%{transform:scale(1.008)}
}

@keyframes v1244Glint{
  0%,78%{
    opacity:0;
    clip-path:polygon(-28% 0,-12% 0,-30% 100%,-46% 100%);
  }
  81%{opacity:0}
  84%{
    opacity:.54;
    clip-path:polygon(2% 0,18% 0,0 100%,-16% 100%);
  }
  88%{
    opacity:.44;
    clip-path:polygon(82% 0,98% 0,80% 100%,64% 100%);
  }
  91%,100%{
    opacity:0;
    clip-path:polygon(128% 0,144% 0,126% 100%,110% 100%);
  }
}

.v1244-logo-stage{
  position:relative;
  display:grid;
  place-items:center;
  width:94px;
  height:94px;
  margin-bottom:18px;
  isolation:isolate;
  transform-origin:50% 52%;
}

.v1244-logo-stage .hero-logo,
.v1244-logo-glint{
  grid-area:1/1;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  object-fit:contain;
}

.v1244-logo-stage .hero-logo{
  position:relative;
  z-index:1;
}

.v1244-logo-glint{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:0;
  filter:
    brightness(1.82)
    sepia(.78)
    saturate(1.65)
    drop-shadow(0 0 8px rgba(229,196,119,.24));
}

.v1244-logo-stage::after{
  content:"";
  position:absolute;
  z-index:3;
  left:4px;
  bottom:-11px;
  width:54px;
  height:1px;
  border-radius:999px;
  background:linear-gradient(
    90deg,
    rgba(229,196,119,.95),
    rgba(229,196,119,.38),
    transparent
  );
  transform-origin:left center;
  opacity:0;
  transform:scaleX(0);
  box-shadow:0 0 10px rgba(229,196,119,.16);
}

.hero-content.v1244-intro .v1244-logo-stage,
.hero-content.v1244-intro .hero-unit,
.hero-content.v1244-intro > h1,
.hero-content.v1244-intro .hero-welcome,
.hero-content.v1244-intro .hero-cta{
  opacity:0;
}

.hero-content.v1244-intro .hero-unit,
.hero-content.v1244-intro > h1,
.hero-content.v1244-intro .hero-welcome,
.hero-content.v1244-intro .hero-cta{
  transform:translateY(15px);
}

.hero-content.v1244-play .v1244-logo-stage{
  animation:v1244LogoEnter .70s cubic-bezier(.16,.82,.24,1) both;
}

.hero-content.v1244-play .v1244-logo-stage::after{
  animation:v1244LineDraw .54s .36s cubic-bezier(.2,.8,.25,1) both;
}

.hero-content.v1244-play .hero-unit{
  animation:v1244CopyIn .52s .48s cubic-bezier(.2,.8,.25,1) both;
}

.hero-content.v1244-play > h1{
  animation:v1244CopyIn .68s .64s cubic-bezier(.18,.82,.25,1) both;
}

.hero-content.v1244-play .hero-welcome{
  animation:v1244CopyIn .52s .78s cubic-bezier(.2,.8,.25,1) both;
}

.hero-content.v1244-play .hero-cta{
  animation:v1244CopyIn .56s .91s cubic-bezier(.18,.82,.25,1) both;
}

.hero-content.v1244-done .v1244-logo-stage,
.hero-content.v1244-done .hero-unit,
.hero-content.v1244-done > h1,
.hero-content.v1244-done .hero-welcome,
.hero-content.v1244-done .hero-cta{
  opacity:1;
  transform:none;
  filter:none;
}

.hero-content.v1244-done .v1244-logo-stage{
  animation:v1244Breathe 8.8s 1.8s ease-in-out infinite;
}

.hero-content.v1244-done .v1244-logo-stage::after{
  opacity:.72;
  transform:scaleX(1);
}

.hero-content.v1244-done .v1244-logo-glint{
  animation:v1244Glint 8.8s 1.8s ease-in-out infinite;
}

@media(min-width:700px){
  .v1244-logo-stage{
    width:112px;
    height:112px;
    margin-bottom:22px;
  }
  .v1244-logo-stage::after{
    width:66px;
    bottom:-12px;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-content.v1244-intro .v1244-logo-stage,
  .hero-content.v1244-intro .hero-unit,
  .hero-content.v1244-intro > h1,
  .hero-content.v1244-intro .hero-welcome,
  .hero-content.v1244-intro .hero-cta{
    opacity:1!important;
    transform:none!important;
    filter:none!important;
  }

  .hero-content.v1244-play .v1244-logo-stage,
  .hero-content.v1244-play .hero-unit,
  .hero-content.v1244-play > h1,
  .hero-content.v1244-play .hero-welcome,
  .hero-content.v1244-play .hero-cta,
  .hero-content.v1244-done .v1244-logo-stage,
  .hero-content.v1244-done .v1244-logo-glint,
  .hero-content.v1244-logo-stage::after{
    animation:none!important;
  }

  .v1244-logo-glint{display:none!important}
  .v1244-logo-stage::after{
    opacity:.72!important;
    transform:scaleX(1)!important;
  }
}
