/* Barion Collection, tela de acesso do Brand Manual (brandmanual/index.php).
   Arquivo externo porque a CSP proíbe estilo inline. Fontes locais do site (/assets/fonts),
   as mesmas do css/styles.css, sem Google Fonts nesta tela. */
@font-face{
  font-family:"Cormorant Garamond"; font-style:normal; font-weight:500 600; font-display:swap;
  src:url("/assets/fonts/cormorant-garamond-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Montserrat"; font-style:normal; font-weight:400 600; font-display:swap;
  src:url("/assets/fonts/montserrat-latin.woff2") format("woff2");
}

:root{
  --ivoire:#F6F3EB; --vert:#12291F; --or:#C8A86A; --erro:#E6B3A6;
  --serif:"Cormorant Garamond", Garamond, "Times New Roman", serif;
  --sans:"Montserrat", "Avenir Next", "Segoe UI", system-ui, sans-serif;
}
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }

.gate{
  min-height:100vh; min-height:100dvh;
  display:grid; place-items:center;
  padding:32px 20px;
  background:var(--vert); color:var(--ivoire);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.gate__box{ width:100%; max-width:380px; text-align:center; }
.gate__mark{ display:block; width:88px; height:auto; margin:0 auto; }
.gate__sub{
  margin-top:16px; font-size:13px; font-weight:500; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(246,243,235,.78);
}
.gate__title{
  margin:40px 0 8px;
  font-family:var(--serif); font-weight:500; font-size:40px; line-height:1.1;
  color:var(--ivoire);
}
.gate__hint{ font-size:15px; color:rgba(246,243,235,.78); margin-bottom:28px; }

.gate__form{ display:flex; flex-direction:column; gap:12px; }
.gate__label{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.gate__input{
  width:100%; min-height:52px; padding:12px 16px;
  background:rgba(246,243,235,.06); color:var(--ivoire);
  border:1px solid rgba(200,168,106,.55); border-radius:2px;
  font:inherit; font-size:17px; text-align:center; letter-spacing:.2em;
}
.gate__input::placeholder{ color:rgba(246,243,235,.6); }
.gate__input:focus{ outline:none; border-color:var(--or); }
.gate__input:focus-visible{ outline:2px solid var(--or); outline-offset:3px; }
.gate__input[aria-invalid="true"]{ border-color:var(--erro); }
.gate__err{ min-height:1.6em; font-size:15px; color:var(--erro); }
.gate__btn{
  min-height:52px; padding:12px 16px;
  background:var(--or); color:var(--vert);
  border:1px solid var(--or); border-radius:2px; cursor:pointer;
  font-family:var(--sans); font-weight:600; font-size:15px; letter-spacing:.2em; text-transform:uppercase;
  transition:background-color .25s ease, color .25s ease;
}
.gate__btn:hover{ background:transparent; color:var(--or); }
.gate__btn:focus-visible{ outline:2px solid var(--ivoire); outline-offset:3px; }

.gate__back{
  display:inline-flex; align-items:center; min-height:44px; margin-top:28px;
  font-size:13px; font-weight:500; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(246,243,235,.78); text-decoration:underline; text-decoration-color:rgba(200,168,106,.55); text-underline-offset:5px;
}
.gate__back:hover{ color:var(--or); }
.gate__back:focus-visible{ outline:2px solid var(--or); outline-offset:3px; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ transition-duration:.01ms !important; }
}