/* Page "Contact" - styles specifiques (le commun est dans main.css). */

.hero{position:relative;background:var(--sarcelle-encre);color:var(--papier);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);align-items:stretch;min-height:380px}
.hero-text{display:flex;flex-direction:column;justify-content:center;padding:64px 56px 64px 0}
.hero .eyebrow{color:var(--sarcelle);margin-bottom:18px}
.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(30px,4.4vw,48px);line-height:1.06;letter-spacing:-0.01em}
.hero h1 span{display:block;color:var(--sarcelle)}
.hero-text p{color:rgba(251,248,242,0.78);font-size:16px;max-width:380px;margin-top:18px;line-height:1.7}
.hero-photo{position:relative;background:#26221E}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-photo .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;color:rgba(251,248,242,0.45);text-align:center;letter-spacing:0.06em;padding:0 24px;line-height:1.6}

section{padding:64px 0}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,0.75fr);gap:0;align-items:stretch}
.form-side{padding-right:56px}
.form-intro{font-family:var(--serif);font-size:19px;font-weight:500;color:var(--sarcelle-fonce);line-height:1.4;max-width:440px;margin-bottom:28px}
.field{margin-bottom:14px}
.field input,.field textarea{width:100%;font-family:var(--sans);font-size:15px;color:var(--encre);background:var(--papier);border:1px solid rgba(28,26,23,0.18);border-radius:8px;padding:14px 16px;transition:border-color .2s}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--sarcelle-fonce)}
.field textarea{resize:vertical;min-height:140px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:8px}
.antispam{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--acier)}
.antispam input{width:64px;text-align:center;padding:10px;border:1px solid rgba(28,26,23,0.18);border-radius:8px;font-family:var(--sans);font-size:15px}
.btn-send{background:var(--sarcelle-fonce);color:var(--encre);border:none;padding:14px 30px;border-radius:6px;font-family:var(--sans);font-weight:600;font-size:15px;cursor:pointer;transition:background .2s,color .2s}
.btn-send:hover{background:var(--sarcelle-encre);color:var(--papier)}
.rgpd{font-size:12px;color:var(--acier);line-height:1.5;margin-top:18px;max-width:520px}

.coord-side{background:var(--sarcelle-encre);color:var(--papier);border-radius:14px;padding:40px 34px;display:flex;flex-direction:column;justify-content:center;text-align:center}
.coord-side h2{font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.25;margin-bottom:30px}
.coord-item{margin-bottom:26px}
.coord-ico{width:46px;height:46px;border-radius:10px;border:1px solid rgba(251,248,242,0.4);display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-size:21px;color:var(--papier)}
.coord-item .v{font-size:15px;color:rgba(251,248,242,0.86);line-height:1.5}
.coord-item a.v:hover{color:var(--sarcelle)}
.coord-insta{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;color:var(--papier);letter-spacing:0.04em;margin-top:4px}
.coord-insta:hover{color:var(--papier)}

.map-wrap{margin-top:48px;border-radius:14px;overflow:hidden;border:0.5px solid rgba(28,26,23,0.14)}
.map-wrap iframe{display:block;width:100%;height:340px;border:0;filter:grayscale(0.25) contrast(1.02)}
#late28-map{width:100%;height:340px;position:relative;z-index:0;background:#eef1f2}
.map-wrap .leaflet-container{font-family:var(--sans)}
.map-wrap .leaflet-popup-content{font-size:12.5px;color:var(--encre);line-height:1.4}
.map-note{font-family:var(--mono);font-size:11px;color:var(--acier);margin-top:10px;letter-spacing:0.03em}

.annuaire{background:#F4EFE5;border-top:0.5px solid rgba(28,26,23,0.1);border-bottom:0.5px solid rgba(28,26,23,0.1)}
.annuaire .eyebrow{color:var(--sarcelle-fonce)}
.annuaire h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3.5vw,32px);line-height:1.12;margin:8px 0 28px}
.ann-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ann-card{background:var(--papier);border:0.5px solid rgba(28,26,23,0.14);border-radius:14px;padding:22px 24px;display:flex;align-items:center;gap:20px;transition:border-color .2s,transform .2s}
.ann-card:hover{border-color:var(--sarcelle-fonce);transform:translateY(-2px)}
.ann-photo{flex:0 0 76px;width:76px;height:76px;border-radius:50%;background:var(--kraft);border:0.5px solid rgba(28,26,23,0.14);display:flex;align-items:center;justify-content:center;overflow:hidden}
.ann-photo img{width:100%;height:100%;object-fit:cover}
.ann-photo .ph{font-size:26px;color:var(--acier)}
.ann-info{flex:1;min-width:0}
.ann-info .nom{font-family:var(--serif);font-weight:600;font-size:18px;color:var(--sarcelle-fonce);line-height:1.15}
.ann-info .role{font-size:14px;color:#3A352E;margin-top:3px;line-height:1.35}
.ann-mail{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:12px;color:var(--acier);margin-top:9px;letter-spacing:0.02em;transition:color .2s}
.ann-mail:hover{color:var(--sarcelle-fonce)}

.aiguillage{background:var(--sarcelle-encre);color:var(--papier)}
.aig-head{text-align:center;margin-bottom:34px}
.aig-head .eyebrow{color:var(--sarcelle)}
.aig-head h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3.5vw,32px);margin-top:8px}
.aig-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.aig-card{border:1px solid rgba(251,248,242,0.16);border-radius:14px;padding:32px 30px;transition:border-color .2s,background .2s}
.aig-card:hover{border-color:var(--sarcelle);background:rgba(255,255,255,0.03)}
.aig-card .aig-ico{font-size:26px;color:var(--papier);margin-bottom:14px;display:block}
.aig-card h3{font-family:var(--serif);font-weight:600;font-size:20px;margin-bottom:8px}
.aig-card p{font-size:14px;color:rgba(251,248,242,0.72);line-height:1.6;margin-bottom:20px}
.aiguillage .btn-solid{padding:12px 24px;font-size:14px}
.aiguillage .btn-mecene{padding:11px 24px;font-size:14px}

@media(max-width:860px){
  .hero-grid{grid-template-columns:1fr}
  .hero-text{padding:48px 0 40px}
  .hero-photo{min-height:240px}
  .contact-grid{grid-template-columns:1fr;gap:34px}
  .form-side{padding-right:0}
  .ann-grid{grid-template-columns:1fr}
  .aig-grid{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
}