/* ================= PAGE ================= */
.gcs-domain-s1{
  /* width:100%;
  min-height:100vh;
  background:linear-gradient(135deg,#eef3ff,#f9fbff); */
  padding:1.4vw;
 
}

/* ================= CONTAINER ================= */
/* .gcs-domain-s2{
  width:100%;
  max-width:1500px;
  background:#fff;
  border-radius:24px;
  padding:4vw;
  box-shadow:0 30px 80px rgba(0,0,0,0.12);
} */
.gcs-domain-s2 {
    width: 100%;
    max-width: 100%;
    background: #f6ffff;
    border-radius: 10px;
    padding: 4vw;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.07);
}
/* ================= LAYOUT ================= */
.gcs-domain-s3{
  display:grid;
  grid-template-columns:42% 56%;
  width:100%;
  /* gap:4vw; */
  gap: 20px;
}

/* ================= LEFT ================= */
.gcs-domain-s4{
  position:sticky;
  top:3vw;
  align-self:flex-start;
  font-family: "Nunito Sans", sans-serif;
}

.gcs-domain-s4 h2{
  font-size:clamp(28px,3vw,44px);
  line-height:1.2;
  color:#024e6a;
}

.gcs-domain-s4 p{
  margin-top:18px;
  font-size:clamp(14px,1.3vw,18px);
  line-height:1.7;
  color:#4a5568;
}

/* ================= RIGHT ================= */
.gcs-domain-s5{
  width:100%;
}

/* ================= SEARCH BAR ================= */
.gcs-domain-s6{
  display:flex;
  width:100%;
  gap:12px;
}

.gcs-domain-s7{
  flex:1;
  min-width:0;
  padding:1.2em;
  border-radius:14px;
  border:1px solid #ccd5e1;
  font-size:1.6rem;
}

.gcs-domain-s8{
  padding:1.2em 2.5em;
  border:none;
  border-radius:14px;
  background:#22c664;
  color:#fff;
  font-size:1.6rem;
  cursor:pointer;
}

/* ================= DROPDOWN ================= */
.gcs-domain-s9{
  margin-top:24px;
  background:#f5f8ff;
  border-radius:16px;
  padding:16px;
  max-height:420px;
  overflow-y:auto;
  display:none;
}

/* scrollbar */
.gcs-domain-s9::-webkit-scrollbar{width:8px;}
.gcs-domain-s9::-webkit-scrollbar-thumb{background:#c7d6ff;border-radius:10px;}

/* ================= ROW ================= */
.gcs-domain-s10{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:12px;
  align-items:start;

  background:#fff;
  padding:16px;
  border-radius:12px;
  margin-bottom:12px;

  animation:gcsFade 0.4s ease;
}

@keyframes gcsFade{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

.gcs-domain-s11{
  font-size:clamp(14px,1.2vw,18px);
  font-weight:600;
  color:#102a43;

  /* Smart wrapping */
  overflow-wrap:anywhere;
  word-break:normal;
  line-height:1.4;
}

.gcs-domain-s12{
  padding:6px 16px;
  border-radius:20px;
  font-size:13px;
  font-weight:600;
}

.gcs-available{background:#d9fbe8;color:#0b7a41;}
.gcs-taken{background:#ffd6d6;color:#b40000;}

.gcs-domain-s13{
  padding:8px 22px;
  border:none;
  border-radius:20px;
  background:#00b16a;
  color:#fff;
  cursor:pointer;
}
.gcs-domain-s14{
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  justify-self:end;
}
/* ================= RESPONSIVE ================= */
@media(max-width:1024px){
  .gcs-domain-s3{grid-template-columns:1fr;}
  .gcs-domain-s4{position:relative;top:0;}
}

@media(max-width:600px){
  .gcs-domain-s6{flex-direction:column;}
  .gcs-domain-s8{width:100%;}


   
   .gcs-domain-s10{
    grid-template-columns:1fr;
  }

  .gcs-domain-s14{
    justify-content:flex-end;
    margin-top:6px;
  }

  .gcs-domain-s12,
  .gcs-domain-s13{
    justify-self:end;
    margin-left:6px;
  }

}