.home-page .home-hero {
  display: grid;
  grid-template-columns: 1fr 1.45fr;
  min-height: 230px;
  border-bottom: 1px solid var(--color-border);
}

.home-page .hero-copy {
  padding: 34px 54px;
}

.home-page .hero-copy p {
  max-width: 600px;
  color: var(--color-text-secondary);
  font-size: 19px;
  line-height: 1.65;
}

.home-page .home-hero-actions {
  display: flex;
  gap: 22px;
  margin-top: 28px;
}

.home-page .home-btn-primary,
.home-page .home-btn-secondary {
  height: 48px;
  padding: 0 28px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  text-decoration: none;
}

.home-page .home-btn-primary {
  background: linear-gradient(180deg, #ff8a1f, #ff6a00);
  color: #050505;
}

.home-page .home-btn-secondary {
  border: 1px solid var(--color-border);
  color: var(--color-text-primary);
  background: rgba(255,255,255,.03);
}

.home-page .hero-code {
  border-left: 1px solid var(--color-border);
  padding: 22px 36px;
  display: flex;
  align-items: flex-start;
}

.home-page .hero-code pre {
  margin: 0;
  color: #ffffff;
  font-size: 15px;
  line-height: 1.75;
}

.home-page .hero-code span,
.home-page .hero-code strong {
  color: #ff8a1f;
}

.home-page .hero-code b {
  color: #7ed957;
  font-weight: 500;
}

.home-page .journey-card {
  margin: 38px 36px 28px;
  padding: 28px 28px 32px;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
}

.home-page .journey-card h1,
.home-page .home-section h2 {
  margin: 0;
  color: var(--color-text-primary);
  font-size: 30px;
  line-height: 1.1;
}

.home-page .section-subtitle {
  margin: 10px 0 24px;
  color: var(--color-text-secondary);
  font-size: 16px;
}

.home-page .journey-steps {
    display: grid;
    grid-template-columns:
        1fr 50px
        1fr 50px
        1fr 50px
        1fr 50px
        1fr 50px
        1fr 50px
        1fr;
    align-items: start;
    gap: 0;
}

.home-page .journey-step {
  min-width: 0;
}

.home-page .step-icon {
    width: 68px;
    height: 68px;
    font-size: 30px;
    margin: 0 auto 14px;
}

.home-page .journey-step h3 {
  margin: 0 0 10px;
  color: #ff7a00;
   font-size: 16px;
}

.home-page .journey-step p {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: 15px;
  line-height: 1.45;
}

.home-page .journey-step code {
  display: block;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid var(--color-border);
  border-radius: 5px;
  background: rgba(255,255,255,.035);
  color: #ffffff;
  font-size: 12px;
  line-height: 1.6;
}

.home-page .journey-step code span {
  color: #ff8a1f;
}

.home-page .journey-step code.success {
  color: #8cff3f;
}

.home-page .arrow {
  color: #ff7a00;
  font-size: 42px;
  padding-top: 28px;
  text-align: center;
}

.home-page .home-section {
  margin: 0 50px 32px;
}

.home-page .docs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  margin-top: 16px;
}

.home-page .doc-card {
  min-height: 92px;
  padding: 20px 18px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  display: grid;
  grid-template-columns: 38px 1fr 24px;
  gap: 14px;
  align-items: start;
  text-decoration: none;
}

.home-page .doc-icon {
  color: #ff7a00;
  font-size: 34px;
}

.home-page .doc-card h3 {
  margin: 0 0 8px;
  color: #ff7a00;
  font-size: 17px;
}

.home-page .doc-card p {
  margin: 0;
  color: var(--color-text-secondary);
  line-height: 1.5;
}

.home-page .doc-card > span {
  color: #ff7a00;
  font-size: 26px;
}

.home-page .resources-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px;
  margin-top: 14px;
}

.home-page .resources-grid a {
  height: 50px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  color: var(--color-text-primary);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 16px;
}                                                                                     .password-input-wrapper{
  position:relative;
}

.password-icon-button{
  position:absolute;
  right:120px;
  top:50%;
  transform:translateY(-50%);
  background:none;
  border:none;
  cursor:pointer;
  font-size:18px;
}

.password-generate-button{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);

  border:none;
  background:none;

  color:#ff7a00;
  cursor:pointer;
  font-size:13px;
  font-weight:700;
}

.password-strength{
  margin-top:12px;
}

.password-strength-bar{
  height:6px;
  background:#232323;
  border-radius:100px;
  overflow:hidden;
}

#password-strength-fill{
  width:0%;
  height:100%;
  background:#ff7a00;
  transition:.25s;
}

#password-strength-text{
  display:block;
  margin-top:8px;
  color:#9ca3af;
  font-size:13px;
}

.password-rules{
  margin-top:14px;
  padding-left:18px;
  color:#9ca3af;
  font-size:13px;
  line-height:1.8;
}

.password-match{
  margin-top:10px;
  font-size:13px;
  font-weight:600;
}