/* Pages thematiques (standard, application, Teams, Beziers) et bloc
   « En savoir plus » de l'accueil. Reprend les variables de style.css. */

.crumbs{font-size:13px;color:var(--muted);padding-top:28px}
.crumbs a{color:var(--blue);text-decoration:none;font-weight:700}
.crumbs a:hover{text-decoration:underline}
.crumbs span[aria-hidden]{margin-inline:8px}

.page-hero{padding-block:34px 70px;display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.page-hero h1{font-size:clamp(38px,4.4vw,62px);letter-spacing:-2px;margin-bottom:24px}
.page-hero .lead{font-size:19px;color:var(--muted);max-width:620px;margin:0 0 30px}
.page-hero .actions{display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center}
.page-hero figure{margin:0;justify-self:center;max-width:300px;width:100%}
.page-hero figure img{width:100%;height:auto;border:1px solid #cfd9e9;border-radius:14px;box-shadow:0 24px 60px -28px #33476766}
.page-hero figcaption{font-size:11px;color:var(--muted);text-align:center;margin-top:12px}
.hero-points{list-style:none;padding:0;margin:0}
.hero-points li{padding:16px 0;font-size:15px;color:var(--muted);border-top:1px solid var(--line)}
.hero-points li:last-child{border-bottom:1px solid var(--line)}

.hero-points strong{display:block;font-size:16px;color:var(--ink)}

.topic{padding-block:70px;border-top:1px solid var(--line)}
.topic.alt{background:var(--pale);border-top:0}
.topic .section-heading{margin-bottom:40px}
.topic .section-heading p{max-width:520px;color:var(--muted);font-size:16px;margin:0}
.topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 42px}
.topic-grid.two{grid-template-columns:repeat(2,1fr)}
.topic-grid article{border-top:1px solid var(--line);padding-top:20px}
.topic-grid h3{font-size:20px;margin-bottom:10px}
.topic-grid p{font-size:15px;color:var(--muted);margin:0}
.topic-grid ul{margin:12px 0 0;padding-left:18px;font-size:14px;color:var(--muted)}
.topic-grid li{margin-bottom:4px}

.prose{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.prose p{color:var(--muted);font-size:16px}
.prose .note{color:var(--ink)}

.related{padding-block:70px;background:var(--pale)}
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.related-grid.three{grid-template-columns:repeat(3,1fr)}
.related-grid a{display:flex;flex-direction:column;gap:8px;background:white;border:1px solid var(--line);border-radius:var(--radius);padding:24px;text-decoration:none;color:var(--ink);transition:border-color .2s,transform .2s}
.related-grid a:hover{border-color:var(--blue);transform:translateY(-2px)}
.related-grid strong{font-size:17px;line-height:1.3}
.related-grid span{font-size:14px;color:var(--muted)}
.related-grid em{font-style:normal;font-size:13px;font-weight:800;color:var(--blue);margin-top:auto}

.footer-topics{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;padding:22px 0 0;border-top:1px solid var(--line);font-size:13px}
.footer-topics a{color:var(--muted);text-decoration:none}
.footer-topics a:hover{color:var(--blue);text-decoration:underline}

@media(max-width:1120px){.related-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:960px){
  .page-hero{grid-template-columns:1fr;gap:40px;padding-bottom:55px}
  .page-hero figure{max-width:260px}
  .topic-grid,.topic-grid.two{grid-template-columns:1fr 1fr}
  .prose{grid-template-columns:1fr;gap:20px}
  .topic,.related{padding-block:55px}
}
@media(max-width:640px){
  .topic-grid,.topic-grid.two,.related-grid,.related-grid.three{grid-template-columns:1fr}
  .page-hero .lead{font-size:17px}

}

.shot{margin:0;justify-self:center;max-width:280px;width:100%}
.shot img{width:100%;height:auto;border:1px solid #cfd9e9;border-radius:14px;box-shadow:0 24px 60px -28px #33476766}
.shot figcaption{font-size:11px;color:var(--muted);text-align:center;margin-top:12px}

/* Pages d'information (confidentialite) : une colonne de lecture, sans cartes */
.legal{max-width:780px;padding-block:40px 80px}
.legal-head{border-bottom:1px solid var(--line);padding-bottom:28px;margin-bottom:28px}
.legal-head h1{font-size:clamp(34px,4vw,50px);letter-spacing:-1.5px;margin-bottom:20px}
.legal-head .lead{font-size:18px;color:var(--muted)}
.legal-date{font-size:13px;color:var(--muted);margin:0}
.legal-toc ol{margin:0 0 20px;padding-left:22px;font-size:15px;columns:2;column-gap:40px}
.legal-toc a{color:var(--blue);text-decoration:none}
.legal-toc a:hover{text-decoration:underline}
.legal-section{padding-top:30px;scroll-margin-top:110px}
.legal-section h2{font-size:26px;letter-spacing:-.5px;margin-bottom:14px}
.legal-section p,.legal-section li{font-size:16px;color:var(--ink)}
.legal-section ul{padding-left:22px;margin:0 0 16px}
.legal-section li{margin-bottom:8px}
@media(max-width:640px){.legal-toc ol{columns:1}.legal{padding-block:24px 56px}}

/* Essayer Driiing : texte et formulaire cote a cote, champs sobres */
.demo-layout{display:grid;grid-template-columns:1fr minmax(0,460px);gap:80px;align-items:start;padding-block:34px 90px}
.demo-copy h1{font-size:clamp(38px,4.4vw,58px);letter-spacing:-2px;margin-bottom:22px}
.demo-copy .lead{font-size:18px;color:var(--muted);max-width:560px}
.demo-steps{list-style:none;padding:0;margin:30px 0;counter-reset:etape}
.demo-steps li{counter-increment:etape;position:relative;padding:16px 0 16px 46px;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
.demo-steps li:last-child{border-bottom:1px solid var(--line)}
.demo-steps li:before{content:counter(etape,decimal-leading-zero);position:absolute;left:0;top:17px;font-size:13px;font-weight:800;color:var(--orange)}
.demo-steps strong{display:block;font-size:16px;color:var(--ink)}
.demo-note{font-size:14px;color:var(--muted);max-width:560px}
.demo-form{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:32px;display:flex;flex-direction:column}
.demo-form h2{font-size:24px;letter-spacing:-.5px;margin-bottom:18px}
.demo-form label{font-size:13px;font-weight:800;margin:14px 0 6px}
.demo-form label span{font-weight:400;color:var(--muted);margin-left:4px}
.demo-form input:not([type=checkbox]){border:1px solid #cfd8e6;border-radius:7px;padding:11px 13px;font-size:15px;color:var(--ink);background:white;width:100%}
.demo-form input:focus{outline:2px solid var(--blue);outline-offset:2px}
.demo-form .demo-consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:13px;color:var(--muted);margin:20px 0 6px;line-height:1.5}
.demo-consent input{margin:3px 0 0;flex:none;width:17px;height:17px;accent-color:var(--blue)}
.demo-consent a{color:var(--blue)}
.demo-form .button{margin-top:18px;border:0}
.demo-form .button:disabled{opacity:.6;transform:none}
.demo-small{font-size:12px;color:var(--muted);margin:14px 0 0}
.demo-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-error{background:#fff4e8;color:#8a4508;border-radius:7px;padding:11px 14px;font-size:14px;margin:0 0 6px}
.contact-try{margin:22px 0 0;font-size:14px!important}
.contact-try a{color:white;font-weight:800}
@media(max-width:960px){.demo-layout{grid-template-columns:1fr;gap:40px}.demo-form{max-width:560px}}
@media(max-width:540px){.demo-form{padding:22px}}

/* Bandeau d'information cookies (aucun cookie depose) */
.cookie-note{position:fixed;left:16px;right:16px;bottom:16px;z-index:50;max-width:560px;margin-inline:auto;display:flex;gap:16px;align-items:center;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px -18px #26354c55;padding:14px 16px;font-size:13px;line-height:1.5;color:var(--muted)}
.cookie-note p{margin:0}
.cookie-note a{color:var(--blue)}
.cookie-note>div{display:flex;gap:8px;flex:none}
.cookie-note button{flex:1;border:1px solid var(--blue);background:var(--blue);color:white;border-radius:7px;padding:9px 14px;font-size:13px;font-weight:800}
.cookie-note button[data-choix=non]{background:white;color:var(--blue)}
@media(max-width:540px){.cookie-note{flex-direction:column;align-items:stretch;text-align:left}}