/* ======================================================
   Au P'tit Serveur - Formulaires
   Formulaire Web3Forms intégré au thème restaurant
   ====================================================== */

.contact-restaurant{
  position:relative;
  overflow:hidden;
  padding:90px 20px;
  background:
    radial-gradient(circle at 20% 0%, rgba(232,184,75,.16), transparent 35%),
    linear-gradient(180deg, rgba(20,8,2,.92) 0%, rgba(8,3,0,.98) 100%);
  border-top:3px solid rgba(160,118,26,.35);
}

.contact-restaurant::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:url('../../images/mur.png');
  background-size:cover;
  background-position:center;
  opacity:.14;
  pointer-events:none;
}

.contact-restaurant-inner{
  position:relative;
  z-index:1;
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);
  gap:34px;
  align-items:start;
}

.contact-copy{
  text-align:left;
  padding:26px 6px;
}

.contact-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--gold-light,#e8b84b);
  font-family:'Caveat',cursive;
  font-size:clamp(26px,3vw,38px);
  margin-bottom:10px;
}

.contact-copy .section-title{
  text-align:left;
  margin-bottom:18px;
}

.contact-copy .section-title::after{
  left:0;
  transform:none;
}

.contact-restaurant .contact-subtitle{
  max-width:560px;
  color:var(--chalk-dim,#c8b89a);
  font-size:17px;
  line-height:1.85;
  margin:0 0 28px;
}

.contact-promises{
  display:grid;
  gap:14px;
  max-width:520px;
}

.contact-promises div{
  background:linear-gradient(135deg, rgba(30,40,32,.85), rgba(18,26,20,.88));
  border:1px solid rgba(200,150,42,.35);
  border-radius:14px;
  padding:16px 18px;
  box-shadow:0 10px 28px rgba(0,0,0,.28);
}

.contact-promises strong{
  display:block;
  color:var(--gold-light,#e8b84b);
  font-family:'Playfair Display',serif;
  font-size:18px;
  margin-bottom:4px;
}

.contact-promises span{
  color:var(--chalk-dim,#c8b89a);
  font-size:14px;
  line-height:1.55;
}

.contact-chef-form{
  background:
    linear-gradient(135deg, rgba(30,40,32,.97), rgba(18,26,20,.98));
  border:2px solid var(--border-gold,#a0761a);
  border-radius:22px;
  padding:clamp(22px,3vw,34px);
  box-shadow:0 18px 55px rgba(0,0,0,.55);
  text-align:left;
}

.contact-form-top{
  display:flex;
  gap:16px;
  align-items:center;
  padding-bottom:20px;
  margin-bottom:22px;
  border-bottom:1px dashed rgba(200,150,42,.32);
}

.contact-form-icon{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg, var(--gold,#c9962a), var(--gold-light,#e8b84b));
  box-shadow:0 10px 26px rgba(0,0,0,.35);
  font-size:30px;
}

.contact-form-top h3{
  font-family:'Playfair Display',serif;
  color:var(--gold-light,#e8b84b);
  font-size:25px;
  margin:0 0 5px;
}

.contact-form-top p{
  color:var(--chalk-dim,#c8b89a);
  margin:0;
  line-height:1.5;
  font-size:14px;
}

.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.contact-field{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:16px;
}

.contact-field span{
  color:var(--chalk,#f0e8d0);
  font-weight:700;
  font-size:14px;
}

.contact-field input,
.contact-field textarea,
.contact-field select{
  width:100%;
  border:1px solid rgba(232,184,75,.35);
  border-radius:14px;
  background:rgba(10,4,1,.58);
  color:var(--chalk,#f0e8d0);
  padding:14px 15px;
  font-family:'Lora',serif;
  font-size:15px;
  outline:none;
  transition:border-color .2s, box-shadow .2s, background .2s;
}

.contact-field textarea{
  min-height:150px;
  resize:vertical;
  line-height:1.7;
}

.contact-field select option{
  background:#160803;
  color:#f0e8d0;
}

.contact-field input::placeholder,
.contact-field textarea::placeholder{
  color:rgba(200,184,154,.68);
  font-style:italic;
}

.contact-field input:focus,
.contact-field textarea:focus,
.contact-field select:focus{
  border-color:var(--gold-light,#e8b84b);
  background:rgba(18,8,2,.75);
  box-shadow:0 0 0 4px rgba(232,184,75,.13);
}

.contact-submit{
  width:100%;
  justify-content:center;
  border:0;
  margin-top:4px;
  font-size:16px;
  cursor:pointer;
}

.contact-note{
  margin:14px 0 0;
  color:rgba(200,184,154,.72);
  font-size:12px;
  line-height:1.6;
  text-align:center;
}

.hp-field{display:none!important;}

@media(max-width:980px){
  .contact-restaurant-inner{grid-template-columns:1fr;}
  .contact-copy{text-align:center;padding-top:0;}
  .contact-copy .section-title{text-align:center;}
  .contact-copy .section-title::after{left:50%;transform:translateX(-50%);}
  .contact-restaurant .contact-subtitle,.contact-promises{margin-left:auto;margin-right:auto;}
}

@media(max-width:680px){
  .contact-restaurant{padding:60px 14px;}
  .contact-grid{grid-template-columns:1fr;gap:0;}
  .contact-form-top{align-items:flex-start;}
  .contact-form-icon{width:48px;height:48px;flex-basis:48px;font-size:24px;}
}