/* VisiPro — Les Rendez-Vous — maquette de présentation */
/* Palette événementiel : papier crème, encre vert profond, accent bordeaux */
:root{
  --paper:#f6f3ec;
  --ink:#1f3431;
  --muted:#5d6762;
  --line:#cdd0c6;
  --accent:#7b2f2a;
  --teinte:#e8e5da;
}
html{box-sizing:border-box; font-size:16px;}
*,*:before,*:after{box-sizing:inherit;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:Arial, Helvetica, sans-serif; font-size:15.5px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent); text-decoration:underline; text-underline-offset:5px; text-underline-thickness:1px;}
a:focus-visible{outline:3px solid var(--accent); outline-offset:2px;}
h1,h2,h3{font-family:Georgia, "Times New Roman", serif; font-weight:400; letter-spacing:-0.03em; margin:0 0 18px;}
h1{font-size:clamp(44px, 4.9vw, 74px); line-height:1.04;}
h2{font-size:clamp(30px, 3.4vw, 50px); line-height:1.15;}
h3{font-size:clamp(22px, 2.2vw, 29px); line-height:1.25;}
em{font-style:italic; color:var(--accent);}
p{margin:0 0 16px;}
.wrap{max-width:1040px; margin:0 auto; padding:0 24px;}
.notice{
  background:var(--teinte); color:var(--ink); font-size:12px; font-weight:700;
  letter-spacing:.08em; text-align:center; padding:8px 0; border-bottom:1px solid var(--line);
}
.site-header{
  border-bottom:1px solid var(--line); background:var(--paper);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:18px 24px; gap:16px; flex-wrap:wrap;}
.brand{font-family:Georgia, "Times New Roman", serif; font-size:clamp(18px, 5vw, 26px); letter-spacing:-0.02em; font-weight:400; text-decoration:none; color:var(--ink); max-width:100%; overflow-wrap:break-word; display:block;}
.nav a{text-decoration:none; color:var(--ink); font-weight:700; font-size:14px; margin-left:24px;}
.tel{text-decoration:none; color:var(--ink); font-weight:700; font-size:14px; text-decoration:underline; text-underline-offset:5px; overflow-wrap:break-word; max-width:100%; display:inline-block;}
.hero{padding:60px 24px 70px 24px;}
.hero-wrap{max-width:1040px; margin:0 auto;}
.hero-wrap{display:grid; grid-template-columns:1.1fr 1fr; gap:34px; align-items:center;}
.hero-text{max-width:480px;}
.eyebrow{font-size:10px; letter-spacing:.14em; font-weight:700; text-transform:uppercase; color:var(--accent); margin-bottom:14px;}
.intro{font-size:16px; line-height:1.75; max-width:440px; margin-bottom:20px;}
.infos{font-size:13px; color:var(--muted); margin-bottom:24px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:10px 0;}
.btn{
  display:inline-block; background:var(--ink); color:#fff; text-decoration:none; font-size:13.5px; font-weight:700;
  padding:16px 26px; border-radius:1px; margin-right:12px; margin-bottom:12px;
}
.lien{color:var(--ink); text-decoration:none; font-weight:700; font-size:13.5px; margin-bottom:12px; display:inline-block;}
.hero-photo figure{margin:0;}
.hero-photo img{width:100%; height:470px; object-fit:cover; object-position:center; display:block;}
.hero-photo figcaption{font-size:12px; color:var(--muted); text-align:center; margin-top:8px; font-style:italic;}
.services{background:var(--teinte); padding:44px 0;}
.services .wrap{display:flex; flex-wrap:wrap; gap:16px; align-items:center;}
.service a{
  text-decoration:none; color:var(--ink); font-weight:700; font-size:14px;
  border:1px solid var(--line); padding:10px 18px; border-radius:1px;
}
.service::after{content:" · "; color:var(--muted);}
.service:last-child::after{content:"";}
.metiers, .espace, .entreprise{padding:86px 0 92px;}
.metiers .two-col, .espace .two-col, .entreprise .two-col{display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:flex-start;}
.num{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:10px;}
.surtitre{font-size:10px; letter-spacing:.14em; font-weight:700; text-transform:uppercase; color:var(--accent); margin-bottom:14px;}
.metier-titre h2{max-width:460px;}
.metier-liste .item{border-top:1px solid var(--line); padding:14px 0; font-size:15px;}
.metier-liste .item:first-child{border-top:none;}
.espace-liste .item{border-top:1px solid var(--line); padding:14px 0; font-size:15px;}
.espace-liste .item:first-child{border-top:none;}
.espace-photo figure{margin:0;}
.espace-photo img{width:100%; height:380px; object-fit:cover; object-position:center; display:block;}
.espace-photo figcaption{font-size:12px; color:var(--muted); text-align:center; margin-top:8px; font-style:italic;}
.tarifs{padding:86px 0; background:var(--teinte);}
.tarifs .wrap{max-width:520px;}
.tarifs h2{max-width:520px;}
.tarifs .btn{margin-top:8px;}
.contact.dark{background:var(--ink); color:var(--paper); padding:86px 0 92px;}
.contact.dark .surtitre{color:var(--accent);}
.contact.dark h2{color:var(--paper);}
.contact.dark p{color:#d8d4c8;}
.contact.dark a{color:#fff; text-decoration:underline; text-underline-offset:5px;}
.contact-lignes{margin-top:26px;}
.contact-lignes div{border-top:1px solid #4a5a55; padding:12px 0; font-size:15px;}
.label{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:4px;}
.tel-big{font-family:Georgia, "Times New Roman", serif; font-size:34px; color:var(--paper); text-decoration:none;}
.site-footer{border-top:1px solid var(--line); padding:34px 0; background:var(--paper);}
.site-footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
.site-footer .brand{font-size:20px;}
.mention{font-size:12px; color:var(--muted);}

/* Tablette : grille services 2 colonnes */
@media (max-width:1100px){
  .hero-wrap{grid-template-columns:1fr;}
  .hero-photo img{height:360px;}
  .services .wrap{justify-content:center;}
  .service::after{content:"";}
  .services .wrap{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
}

/* Mobile */
@media (max-width:760px){
  .header-inner{flex-direction:column; align-items:stretch; padding:16px;}
  .nav{display:none;}
  .nav a:focus-visible{outline:3px solid var(--accent);}
  .tel{order:3; margin-top:12px; text-align:center; display:block;}
  .brand{order:1; text-align:center; margin-bottom:4px;}
  .hero{padding:40px 0 50px;}
  .hero h1{font-size:44px;}
  .hero-text{max-width:none;}
  .hero-photo img{height:300px;}
  .metiers .two-col, .espace .two-col, .entreprise .two-col{grid-template-columns:1fr;}
  .espace-photo img{height:260px;}
  .contact-lignes div{font-size:14px;}
  .tel-big{font-size:28px;}
  section{padding:56px 0 62px;}
  .services{padding:36px 0;}
}
@media (max-width:360px){
  .wrap{padding:0 16px;}
  .hero h1{font-size:40px;}
}
.contact.dark .surtitre,.contact.dark .label{color:#f5e6d8;}
.contact.dark .btn{background:var(--paper); color:var(--ink);}
@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none !important; transition:none !important;}}
