/* ===== CONTACT PAGE ===== */

/* Page Header */
.contact-hero{
  padding:100px 0 60px;
  text-align:center;
  background:var(--c-gradient-135);
  position:relative;
}
.contact-hero::after{
  content:'';
  position:absolute;
  bottom:0;left:0;right:0;
  height:120px;
  background:linear-gradient(180deg,transparent,var(--c-bg));
}
.contact-hero .container{position:relative;z-index:1}
.contact-hero h1{margin-bottom:16px;font-size:2.6rem}
.contact-hero h1 .gradient-text{
  background:var(--c-gradient);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.contact-hero .subtitle{
  font-size:1.15rem;
  color:var(--c-text-muted);
  max-width:640px;
  margin:0 auto;
}

/* ===== CONTACT INFO CARDS ===== */
.contact-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.contact-card{
  background:var(--c-surface);
  border:1px solid var(--c-border);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  text-align:center;
  transition:var(--transition);
}
.contact-card:hover{
  border-color:var(--c-cyan);
  transform:translateY(-4px);
  box-shadow:var(--shadow);
}
.contact-card .contact-icon{
  font-size:2rem;
  margin-bottom:16px;
  display:block;
}
.contact-card h3{
  font-size:1.1rem;
  margin-bottom:8px;
}
.contact-card p{
  font-size:.95rem;
  color:var(--c-text-muted);
  line-height:1.5;
}
.contact-card a{
  color:var(--c-cyan);
  font-weight:500;
}
.contact-card a:hover{
  color:var(--c-green);
}

/* ===== MAP CONTAINER ===== */
.map-container{
  position:relative;
  width:100%;
  padding-bottom:56.25%; /* 16:9 aspect ratio */
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid var(--c-border);
  background:var(--c-bg-alt);
}
.map-container iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0;
}

/* ===== CONTACT FORM ===== */
.contact-form-section{
  background:var(--c-bg-alt);
}
.contact-form-wrapper{
  max-width:680px;
  margin:0 auto;
}
.contact-form{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.form-group{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.form-group label{
  font-size:.9rem;
  font-weight:600;
  color:var(--c-white);
}
.form-group input,
.form-group textarea{
  background:var(--c-surface);
  border:1px solid var(--c-border);
  border-radius:var(--radius);
  padding:14px 16px;
  font-size:1rem;
  color:var(--c-text);
  font-family:inherit;
  transition:var(--transition);
  outline:none;
  width:100%;
}
.form-group input::placeholder,
.form-group textarea::placeholder{
  color:var(--c-text-dim);
}
.form-group input:focus,
.form-group textarea:focus{
  border-color:var(--c-cyan);
  box-shadow:0 0 0 3px rgba(0,217,255,.15);
}
.form-group textarea{
  min-height:160px;
  resize:vertical;
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}
.form-submit{
  display:inline-block;
  padding:16px 40px;
  background:var(--c-gradient);
  color:var(--c-bg);
  font-size:1rem;
  font-weight:600;
  border:none;
  border-radius:50px;
  cursor:pointer;
  transition:var(--transition);
  text-align:center;
  align-self:flex-start;
}
.form-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,217,255,.3);
}

/* ===== QUICK BOOK SECTION ===== */
.quick-book{
  background:var(--c-gradient);
  border-radius:var(--radius-lg);
  padding:56px 48px;
  text-align:center;
}
.quick-book h2{
  color:var(--c-bg);
  margin-bottom:12px;
}
.quick-book p{
  color:rgba(26,26,46,.7);
  margin-bottom:28px;
  font-size:1.1rem;
}
.quick-book-buttons{
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
}
.quick-book .btn{
  background:var(--c-bg);
  color:var(--c-white);
}
.quick-book .btn:hover{
  box-shadow:0 8px 24px rgba(0,0,0,.3);
}

/* ===== FAQ TEASER ===== */
.faq-teaser{
  text-align:center;
}
.faq-teaser p{
  color:var(--c-text-muted);
  font-size:1.1rem;
  margin-bottom:20px;
}

/* ===== RESPONSIVE: 768px ===== */
@media(max-width:768px){
  .contact-hero{padding:72px 0 48px}
  .contact-hero h1{font-size:2rem}

  .contact-cards{grid-template-columns:1fr}

  .map-container{
    border-radius:var(--radius);
  }

  .form-row{grid-template-columns:1fr}

  .form-submit{width:100%}

  .quick-book{padding:40px 24px}
  .quick-book-buttons{flex-direction:column;align-items:center}
  .quick-book-buttons .btn{width:100%;max-width:320px}
}

/* ===== RESPONSIVE: 480px ===== */
@media(max-width:480px){
  .contact-hero h1{font-size:1.65rem}

  .contact-card{padding:24px 20px}

  .form-group input,
  .form-group textarea{
    padding:12px 14px;
    font-size:.95rem;
  }

  .quick-book{padding:32px 20px}
}