/* ── HOME PAGE ───────────────────────────────────────────── */
.home-hero{
  padding:80px 24px 0px;
  max-width:860px;margin:0 auto;  /* Matches footer's 860px */
}
.greeting{
  font-size:0.8rem;letter-spacing:0.25em;text-transform:uppercase;
  color:var(--text-dim);margin-bottom:16px;
}
.hero-name{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(3rem,8vw,6rem);letter-spacing:0.08em;
  color:var(--text);line-height:0.95;margin-bottom:12px;
}
.hero-title{
  font-family:'Lora',serif;font-size:1.1rem;font-style:italic;
  color:var(--accent2);margin-bottom:40px;
}
.home-bio{
  max-width:860px;  /* Keeps text lines at a comfortable reading length */
  font-size:0.9rem;line-height:1.85;
  color:var(--text);margin-bottom:0px;
}
.home-bio a{color:var(--accent3)}
/* ── CONTACT FORM STYLES ─────────────────────────────────── */
.contact-section {
  max-width: 860px;
  margin: 0 auto;
  padding: 0 24px 60px;
}

.contact-section .section-title {
  font-family:'Bebas Neue',sans-serif;
  font-size:1.4rem;
  letter-spacing:0.1em;
  color:var(--accent2);
  margin-bottom:16px;
}

.contact-intro {
  max-width: 860px;
  color: var(--text-dim);
  margin-bottom: 24px;
  font-size: 0.9rem;
}

.contact-form {
  max-width: 860px;
  background: var(--surface);
  padding: 24px;
  border-radius: 8px;
  border: 1px solid var(--cell-border);
}

/* Two-column layout for name and email */
.form-row {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
}

.form-row .form-group {
  flex: 1;
  margin-bottom: 0;  /* Remove bottom margin since row handles it */
}

.form-group {
  margin-bottom: 16px;
}

.form-group label {
  display: block;
  margin-bottom: 4px;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-dim);
}

.form-group .required {
  color: var(--accent2);
}

.form-group input,
.form-group textarea {
  width: 100%;
  padding: 10px;
  background: var(--bg);
  border: 1px solid var(--cell-border);
  border-radius: 4px;
  color: var(--text);
  font-family: 'DM Mono', monospace;
  font-size: 0.9rem;
  transition: all 0.15s;
  box-sizing: border-box;  /* Important for side-by-side layout */
}

.form-group textarea {
  resize: vertical;
}

/* Flex layout for captcha and button */
.form-actions {
  display: flex;
  align-items: center;
  gap: 86px;
  margin-top: 8px;
}

.g-recaptcha {
  transform: scale(0.7);
  transform-origin: left center;  /* Changed from 0 0 to left center */
  flex-shrink: 0;  /* Prevent captcha from shrinking */
}

.submit-btn {
  background: var(--accent);
  color: var(--bg);
  border: none;
  padding: 10px 28px;
  font-family: 'DM Mono', monospace;
  font-size: 0.8rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s;
  font-weight: 500;
  white-space: nowrap;  /* Prevent button text from wrapping */
  flex-shrink: 0;  /* Prevent button from shrinking */
}

.submit-btn:hover {
  background: var(--accent2);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.form-status {
  margin-top: 12px;
  padding: 10px;
  border-radius: 4px;
  font-size: 0.85rem;
}

/* Responsive adjustments */
@media (max-width: 640px) {
  .form-row {
    flex-direction: column;  /* Stack name and email on mobile */
    gap: 16px;
  }
  
  .form-actions {
    flex-direction: column;  /* Stack captcha and button on mobile */
    align-items: flex-start;
    gap: 12px;
  }
  
  .g-recaptcha {
    transform-origin: left center;
  }
  
  .submit-btn {
    width: 100%;
  }
}