/* Contact Us page styles for HeavenBroHotel - scoped, responsive, accessible */
:root {
  --hb-black: #0B0B0D;
  --hb-gold: #CFAE52;
  --hb-amber: #D9902E;
  --hb-red: #8B0000;
  --hb-champagne: #F7F2E7;
  --hb-muted: #868B98;
  --hb-border: rgba(255,255,255,0.12);
}

/* Hero */
.contact-hero {
  background: radial-gradient(1200px 600px at 20% -10%, rgba(207,174,82,0.25), transparent),
              linear-gradient(135deg, rgba(11,11,13,0.95), rgba(11,11,13,0.85)),
              var(--hb-black);
  color: var(--hb-champagne);
  padding: 6rem 1rem 3rem;
}
.contact-hero__inner { max-width: 1200px; margin: 0 auto; text-align: center; }
.contact-hero h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.2; margin-bottom: .75rem; }
.contact-hero__tagline { color: var(--hb-muted); margin-bottom: 1.5rem; }
.contact-hero__cta { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; }

/* Buttons */
.hb-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 1.25rem; border-radius: 999px; border: 1px solid transparent; text-decoration: none; font-weight: 600; cursor: pointer; transition: transform .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease; }
.hb-btn:focus-visible { outline: 2px solid var(--hb-gold); outline-offset: 2px; }
.hb-btn--primary { background: linear-gradient(180deg, var(--hb-gold), #a9882c); color: #1a1204; border-color: #a9882c; }
.hb-btn--primary:hover { transform: translateY(-1px); filter: brightness(1.05); }
.hb-btn--ghost { background: transparent; color: var(--hb-champagne); border-color: var(--hb-border); }
.hb-btn--ghost:hover { border-color: var(--hb-gold); color: var(--hb-gold); }
.hb-btn--link { background: none; border: none; color: var(--hb-gold); padding: .5rem .25rem; }
.hb-btn--link:hover { color: #ffd46a; }

/* Layout containers */
.contact-container { max-width: 1200px; margin: 0 auto; padding: 2rem 1rem; }

/* Intro */
.contact-intro .contact-container { display: grid; grid-template-columns: 1.5fr .9fr; gap: 2rem; align-items: start; }
.contact-intro__primary p { color: var(--hb-muted); }
.contact-quicklinks { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; padding: 0; list-style: none; }
.contact-quicklinks a { color: var(--hb-gold); text-decoration: none; border-bottom: 1px dashed transparent; }
.contact-quicklinks a:hover { border-bottom-color: var(--hb-gold); }

/* Cards */
.contact-card { border: 1px solid var(--hb-border); border-radius: 12px; padding: 1.25rem; background: rgba(255,255,255,0.02); backdrop-filter: blur(4px); }
.contact-card__title { margin-top: 0; }

/* Form */
.contact-form-section { background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0)); }
.contact-form__subtitle { color: var(--hb-muted); margin-top: -.25rem; }
.contact-status { min-height: 1.25rem; margin: .5rem 0 0; font-weight: 600; }
.contact-status.success { color: #3ad29f; }
.contact-status.error { color: #ff7a7a; }

.contact-fieldset { border: 1px solid var(--hb-border); padding: 1rem; border-radius: 12px; margin: 1rem 0; }
.contact-legend { padding: 0 .5rem; color: var(--hb-gold); font-weight: 700; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }
.form-control { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; }
.form-control--inline { flex-direction: row; align-items: center; gap: .75rem; }
.field-hint { font-size: .85rem; color: var(--hb-muted); margin-top: -.25rem; }

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form input[type="date"],
.contact-form input[type="number"],
.contact-form input[type="url"],
.contact-form input[type="file"],
.contact-form select,
.contact-form textarea {
  background: rgba(255,255,255,0.04);
  color: var(--hb-champagne);
  border: 1px solid var(--hb-border);
  border-radius: 10px;
  padding: .75rem .9rem;
}
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #b9bdc7; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { outline: 2px solid var(--hb-gold); outline-offset: 2px; }

.checkbox input { margin-right: .5rem; }
.form-actions { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin-top: .25rem; }
.form-note { color: var(--hb-muted); font-size: .95rem; }

.conditional-group .conditional { display: none; }
.conditional-group .conditional.active { display: block; }

/* Departments */
.dept-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.dept-item { border: 1px solid var(--hb-border); border-radius: 12px; padding: 1rem; background: rgba(255,255,255,0.02); }
.dept-item h3 { margin: 0 0 .25rem; font-size: 1.05rem; }
.dept-item p { margin: .25rem 0; }
.dept-item a { color: var(--hb-gold); text-decoration: none; }
.dept-item a:hover { text-decoration: underline; }

/* Final CTA */
.contact-cta-final { border-top: 1px solid var(--hb-border); }
.contact-cta-final__inner { display: grid; grid-template-columns: 1.5fr .8fr; gap: 1rem; align-items: center; }
.contact-cta-final__actions { display: flex; gap: .75rem; justify-content: flex-end; }

/* Accessibility helpers */
.hb-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Responsive */
@media (max-width: 992px) {
  .contact-intro .contact-container { grid-template-columns: 1fr; }
  .contact-departments { max-width: 100%; }
  .contact-cta-final__inner { grid-template-columns: 1fr; }
  .contact-cta-final__actions { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .form-grid { grid-template-columns: 1fr; }
  .contact-hero { padding: 4.5rem 1rem 2.25rem; }
}