/* MaplSoft – feuille de style unique du site statique */
:root{
  --bleu:#004984; --bleu-clair:#78d4ff; --bleu-pale:#b4e2ff; --fond:#f2f3f8;
  /* Réglables depuis l'administration (onglet Apparence) */
  --c-titres:var(--bleu); --c-liens:var(--bleu); --c-boutons:var(--bleu); --c-menu:var(--bleu);
  --bandeau1:var(--bleu-clair); --bandeau2:var(--bleu-pale);
  --texte:#004984; --wrap:1140px;
  --titres:"Open Sans","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --corps:Raleway,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --menu:Montserrat,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.7 var(--corps);color:var(--texte);background:#fff}
img{max-width:100%;height:auto}
a{color:var(--c-liens)}
h1,h2,h3{font-family:var(--titres);font-weight:600;line-height:1.3;color:var(--c-titres);margin:1.6em 0 .6em}
h1{font-size:2.2rem} h2{font-size:1.6rem} h3{font-size:1.25rem}
h2.big{font-size:2.2rem;margin-top:0}
h2.big a{text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.narrow{max-width:900px}

/* En-tête */
.site-header{background:#fff;box-shadow:0 1px 8px rgba(0,73,132,.08);position:sticky;top:0;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;min-height:90px}
.logo img{display:block}
.main-nav ul{list-style:none;display:flex;gap:32px;margin:0;padding:0}
.main-nav a{font:500 14px var(--menu);text-transform:uppercase;letter-spacing:.5px;text-decoration:none;color:var(--c-menu);padding:6px 0;border-bottom:2px solid transparent}
.main-nav a:hover,.main-nav a[aria-current]{border-color:var(--bleu-clair)}
.menu-toggle,.burger{display:none}

/* Boutons */
.btn{display:inline-block;background:var(--c-boutons);color:#fff;font:600 12px var(--titres);text-transform:uppercase;letter-spacing:1px;text-decoration:none;padding:11px 24px;border-radius:30px;border:0;cursor:pointer;margin-top:12px}
.btn:hover{filter:brightness(1.2)}
.btn-light{background:#fff;color:var(--c-boutons)}
.btn-light:hover{background:var(--fond);filter:none}

/* Héros (accueil) */
.hero{background:url(../images/2021/09/houses-bk-right-1.png) right bottom/contain no-repeat,linear-gradient(45deg,var(--bandeau1),var(--bandeau2))}
.hero-inner{display:flex;align-items:center;gap:40px;min-height:520px;padding-top:30px;padding-bottom:30px}
.hero-text{flex:1}
.hero-text h1{margin-top:0;color:#fff;font-size:2.4rem}
.hero-text p{color:#fff;font-size:1.05rem}
.hero-img{flex:1;max-width:520px}

/* Sections */
.section{padding:70px 0}
.houses-left{background:url(../images/2021/09/houses-bk-left50.png) left bottom/auto 80% no-repeat}
.list{padding-left:1.2em}
.list li{margin:.35em 0}

/* Tuiles des fonctionnalités */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px;margin-top:30px}
.tile{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:4px;text-decoration:none;transition:transform .2s}
.tile:hover{transform:translateY(-4px)}
.tile img{display:block;width:100%;height:100%;object-fit:cover}
.tile span{position:absolute;left:8px;right:8px;bottom:14px;text-align:center;color:#fff;font:600 14px/1.35 var(--titres)}

/* Bandeau de logos défilant */
.users{background:url(../images/2021/09/houses-bk-right-1.png) right bottom/contain no-repeat;padding-bottom:50px}
.marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee ul{list-style:none;display:flex;gap:36px;margin:0;padding:0;width:max-content;animation:defile 90s linear infinite}
.marquee:hover ul{animation-play-state:paused}
.marquee li{flex:none;height:90px;display:flex;align-items:center}
.marquee img{max-height:90px;max-width:140px}
@keyframes defile{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee ul{animation:none;flex-wrap:wrap;width:auto}}

/* Bannière des pages intérieures */
.page-banner{background:url(../images/2021/09/head-bk.png) center/cover no-repeat,linear-gradient(45deg,var(--bandeau1),var(--bandeau2));padding:70px 0}
.page-banner h1{margin:0;color:#fff;font-size:2.4rem}

/* Applications */
.feature{display:flex;gap:28px;align-items:flex-start;padding:30px 0;border-bottom:1px solid #e3e8f0;scroll-margin-top:110px}
.feature:last-child{border-bottom:0}
.feature>img{flex:none;width:120px;border-radius:4px}
.feature h3{margin-top:0}

/* Tarif */
.prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin:24px 0 32px}
.price{background:var(--fond);border-radius:6px;padding:24px;text-align:center;border-top:4px solid var(--bleu-clair)}
.price p{margin:0}
.price .who{font-weight:600}
.price .amount{font:600 2rem var(--titres);margin-top:8px}
.price .amount span{display:block;font:400 .85rem var(--corps)}

/* Références */
.refs{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px}
.refs li{background:#fff;border:1px solid #e3e8f0;border-radius:6px;padding:16px;text-align:center;font-size:.9rem;font-weight:600}
.refs img,.refs .noimg{display:block;height:90px;width:100%;object-fit:contain;margin-bottom:10px}
.etc{font-style:italic}

/* Formulaire */
.contact-form{display:grid;gap:16px;margin-bottom:40px}
.contact-form label{display:block;font-weight:600}
.contact-form fieldset{border:0;padding:0;margin:0}
.contact-form legend{font-weight:600;padding:0;margin-bottom:4px}
.contact-form .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form .row2 legend{grid-column:1/-1}
.contact-form .row2 label{font-weight:400;font-size:.85rem}
.contact-form input,.contact-form textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;font:inherit;color:#222;border:1px solid #c9d3e0;border-radius:4px}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--bleu-clair);border-color:var(--bleu-clair)}
.contact-form abbr{text-decoration:none;color:#c0392b}
.contact-form .btn{justify-self:start}
.hp{position:absolute;left:-9999px}

/* Pied de page */
.site-footer{background:url(../images/2021/09/head-bk.png) center/cover no-repeat,var(--fond);color:var(--texte);font-size:14px;padding-top:50px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr;gap:50px}
.site-footer h2{font:400 1.5rem var(--titres);margin-top:0}
.copyright{text-align:center;padding:30px 0;margin:0;font-size:13px}

/* Mobile */
@media (max-width:860px){
  .burger{display:flex;flex-direction:column;gap:5px;cursor:pointer;padding:10px}
  .burger span{display:block;width:26px;height:3px;background:var(--c-menu);border-radius:2px}
  .main-nav{display:none;position:absolute;top:90px;left:0;right:0;background:#fff;box-shadow:0 8px 12px rgba(0,0,0,.08)}
  .main-nav ul{flex-direction:column;gap:0;padding:10px 24px 20px}
  .main-nav a{display:block;padding:12px 0}
  .menu-toggle:checked ~ .main-nav{display:block}
  .hero-inner{flex-direction:column;text-align:left}
  .hero-text h1,h2.big{font-size:1.7rem}
  .footer-grid{grid-template-columns:1fr;gap:10px}
  .feature{flex-direction:column}
  .feature>img{width:90px}
  .contact-form .row2{grid-template-columns:1fr}
}

/* Liens des références */
.refs a{display:block;color:inherit;text-decoration:none;height:100%}
.refs li:has(a){transition:box-shadow .2s,transform .2s}
.refs li:has(a):hover{box-shadow:0 6px 18px rgba(0,73,132,.12);transform:translateY(-3px)}
.refs a:hover span{text-decoration:underline}

/* Blocs de texte modifiables depuis l'administration */
.rich ul,.rich ol{padding-left:1.2em}
.rich li{margin:.35em 0}
.rich>:first-child{margin-top:0}
.feature .rich h3{margin-top:0}

/* Logos cliquables du bandeau défilant */
.marquee a{display:flex;align-items:center;height:100%;transition:transform .2s}
.marquee a:hover,.marquee a:focus-visible{transform:scale(1.08)}

/* Message sous le formulaire */
.form-note{margin:0;padding:10px 14px;border-radius:4px;background:#fdf1e6;color:#8a4b08;font-size:.95rem}

/* Champs du formulaire (configurables dans l'administration) */
.contact-form .fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form .fld{grid-column:1/-1;min-width:0}
.contact-form .fld.demi{grid-column:auto}
.contact-form select{display:block;width:100%;margin-top:4px;padding:10px 12px;font:inherit;color:#222;border:1px solid #c9d3e0;border-radius:4px;background:#fff}
.contact-form .aide{display:block;font-weight:400;font-size:.85rem;opacity:.8}
.contact-form fieldset.groupe legend{font-weight:600}
.contact-form .choix-liste{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:6px}
.contact-form label.choix{display:flex;align-items:flex-start;gap:8px;font-weight:400;cursor:pointer}
.contact-form label.choix input{display:inline-block;width:auto;margin:.45em 0 0;accent-color:var(--c-boutons)}
.contact-form label.choix.seule{font-weight:400}
.contact-form .form-titre h3{margin:.6em 0 0}
.contact-form .form-titre p{margin:.2em 0 0}
@media (max-width:860px){.contact-form .fields{grid-template-columns:1fr}.contact-form .fld.demi{grid-column:1/-1}}