/* =========================
   REGISTER PREMIUM V2
========================= */

.register-main{
  min-height: calc(100vh - var(--header-h));
}

.register-hero{
  position: relative;
  min-height: calc(100vh - var(--header-h));
  padding: 46px 0 80px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

/* Background glow */
.register-shade{
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 10%, rgba(132,167,255,0.18), transparent 25%),
    radial-gradient(circle at 80% 20%, rgba(255,210,120,0.12), transparent 30%),
    linear-gradient(180deg, rgba(5,9,18,.3), rgba(5,9,18,.7));
  pointer-events: none;
}

.register-layout{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 28px;
}

/* =========================
   LEFT SIDE
========================= */

.register-kicker{
  text-align: center;
  color: var(--gold-2);
  font-size: .9rem;
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
}

.register-left h1{

    background: linear-gradient(180deg, #efdbc3 0%, #f3dfbf 18%, #f3dfbf 38%, #f3d89e 52%, #f6cb6a 70%, #f3dfbf 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    font-size: 172px;
    font-family: "Cormorant Garamond", serif;
    text-shadow: 0 2px 28px rgba(0, 0, 0, .35), 0 6px 14px rgba(0, 0, 0, .25);
    filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.7)) drop-shadow(0 0 1px rgba(0, 0, 0, 0.6)) drop-shadow(0 0 2px rgba(0, 0, 0, 0.5)) drop-shadow(0 0 1px rgba(0, 0, 0, 01));
}

/* =========================
   FORM
========================= */

.register-form{
  display: grid;
  gap: 14px;
}

.field label{
  font-weight: 700;
  color: #eef3ff;
}

.field-box{
  display: flex;
  align-items: center;
  gap: 12px;

  min-height: 68px;
  padding: 0 16px;

  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);

  background: linear-gradient(180deg, rgba(10,18,37,.8), rgba(6,12,24,.9));
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center; /* 👈 isso centraliza vertical */
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 25px rgba(0,0,0,.35);

  transition: all .2s ease;
}

.field-box:focus-within{
  border-color: rgba(243,216,158,.6);
  box-shadow:
    0 0 0 1px rgba(243,216,158,.2),
    0 0 16px rgba(243,216,158,.25);
  transform: translateY(-2px);
}

.field-ico{
  width: 58px;
  height: 58px; 
  font-size: 1.2rem;
  color: #f2cd79;
  filter: drop-shadow(0 0 6px rgba(242,200,110,.3));
  display: flex;
  align-items: center;
  justify-content: center;
}

.field-ico img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  opacity: 0.8;
}

.field-box input{
  width: 100%;
  border: none;
  outline: none;
  background: transparent;

  color: #fff;
  font-size: 1rem;
  font-weight: 600;
}

.field-box input::placeholder{
  color: #9fb0cc;
}

/* =========================
   BUTTON
========================= */

.register-submit{
position: relative;
    overflow: hidden;
    color: #211606;
    border-radius: 999px;
    border: 1px solid rgba(255, 223, 130, 0.9);
    font-family: Jost, sans-serif;    
    font-size: 25px;    
    background: linear-gradient(180deg, #f3cf73 0%, #dcb45a 55%, #b9852f 100%);
    box-shadow: 0 0 0 1px rgba(255, 220, 120, 0.18), 0 0 10px rgba(255, 210, 90, 0.35), 0 0 22px rgba(255, 196, 70, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 -1px 0 rgba(120, 72, 10, 0.20);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.10);
    width: 320px;
    min-height: 60px;
   justify-content: center;
   align-items: center;
   margin: 28px auto 0;
   cursor: pointer;   
}

/*register-submit{
  margin-top: 8px;

  min-height: 64px;
  border-radius: 999px;

  font-weight: 800;
  font-size: 1.1rem;

  color: #2b1a05;

  background:
    linear-gradient(180deg, rgba(255,230,150,.25), transparent 40%),
    linear-gradient(180deg, #d8a93a, #c99024);

  border: 1px solid #f1c96d;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.3),
    0 0 14px rgba(255,210,120,.4),
    0 12px 28px rgba(0,0,0,.35);

  cursor: pointer;
  transition: all .2s ease;
}
*/
.register-submit:hover{
  transform: translateY(-3px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.3),
    0 0 22px rgba(255,210,120,.6),
    0 16px 32px rgba(0,0,0,.45);
}

/* =========================
   RIGHT SIDE (CARDS)
========================= */

.register-right{
  display: grid;
  gap: 18px;
}

.info-card{
  padding: 22px;

  border-radius: 20px;
  border: 1px solid rgba(255, 215, 140, 0.25);
  background: linear-gradient(180deg, rgba(8,15,31,.8), rgba(5,10,21,.9));
  backdrop-filter: blur(6px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 20px 40px rgba(0,0,0,.4);
}

.info-card h2{
  text-align: center;

  font-family: "Cormorant Garamond", serif;
  font-size: 2.4rem;

  background: #edba6c;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.info-box{
  margin-top: 12px;
  padding: 14px;

  border-radius: 14px;
  border: 2px solid rgba(255,255,255,.06);
}

.info-box h3{
  margin: 0 0 6px;
  color: #f2cd79;
    font-size: 28px

}

.info-box p,
.info-box li{
  color: #dbe3f3;
  font-size: 21px;
}

.tag-list{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.tag{
  padding: 8px 14px;
  border-radius: 999px;

  background: linear-gradient(180deg,#1b356f,#102554);
  border: 1px solid #6fa0ff;

  color: #eef3ff;
  font-weight: 700;
  font-size: .85rem;

  box-shadow: 0 0 12px rgba(100,150,255,.35);
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width: 1100px){
  .register-layout{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px){
  .register-hero{
    padding: 40px 0;
  }

  .field-box{
    min-height: 60px;
  }

  .register-submit{
    min-height: 58px;
  }
}


.password-box{
  position: relative;
}

.toggle-pass{
  cursor: pointer;
  font-size: 18px; 
  display: flex;
  align-items: center; /* centraliza tudo */
  color: #f2cd79;
  opacity: 0.8;
  transition: all .2s ease;
  text-align: center;
}

.toggle-pass img{
  width: 74px;
  height: 78px;
  object-fit: contain;
}

.toggle-pass:hover{
  opacity: 1;
  transform: scale(1.1);
}


.toggle-pass.is-hidden{
  opacity: 0.7;
}

.toggle-pass:not(.is-hidden){
  color: #ffcc66;
  text-shadow: 0 0 8px rgba(255,200,100,.5);
}


.register-header{
 text-align: center;
  margin: 0 auto 40px;
  width: 100%;
}

.register-title{
  display: block;
  width: 100%;
  text-align: center;
  font-size: 72px
}

.field{
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.field:last-of-type{
  padding-bottom: 0;
  border-bottom: none;
}

.register-submit{
  display: flex;
}

.register-form-card{
  width: 100%;
  max-width: 640px;
  margin: 0 auto;

  padding: 26px 22px 20px;

  border-radius: 22px;

  border: 1px solid rgba(255, 215, 140, 0.25);

  background:
    linear-gradient(
      180deg,
      rgba(8, 14, 28, 0.85),
      rgba(4, 8, 18, 0.95)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 25px 60px rgba(0,0,0,0.65),
    0 0 0 1px rgba(255, 210, 120, 0.08);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}


.register-msg{
  margin-bottom:10px;
  color:#f0d79c;
  font-weight:600;
}


.register-main{
  min-height: calc(100vh - var(--header-h));
  padding-top: var(--header-h);
}

/* finall */

/* deixa toda a caixa do input clicável */
.field-box{
  cursor: text;
}

.field-box input{
  height: 68px;
  min-height: 68px;
  cursor: text;
}

.field-box:has(input){
  cursor: text;
}
