/* Toile métiers – Agencement Restauration by Europrojet */
.toile{--toile:#066aab;--toile-ink:#16202b;--toile-soft:#5b6875;--toile-line:#e3e9ef;--toile-bg:#f4f7fa;
  font-family:inherit;color:var(--toile-ink);box-sizing:border-box}
.toile *,.toile *::before,.toile *::after{box-sizing:border-box}
.toile a{text-decoration:none}

/* Barre d'accès rapide */
.toile-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:1200px;margin:16px auto;padding:12px 16px;
  background:#fff;border:1px solid var(--toile-line);border-left:4px solid var(--toile);border-radius:10px}
.toile-bar-lbl{font-weight:700;font-size:14px;margin-right:4px}
.toile-bar a{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--toile-bg);color:var(--toile);
  font-size:14px;font-weight:600;line-height:1.2;transition:background .15s,color .15s}
.toile-bar a:hover{background:var(--toile);color:#fff}

/* Grand bloc */
.toile-wrap{padding:0 16px}
.toile-block{max-width:1200px;margin:48px auto;padding:40px 36px;background:var(--toile-bg);border-radius:16px}
.toile-head{margin-bottom:28px}
.toile-kicker{margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--toile)}
.toile-head h2{margin:0 0 8px;font-size:clamp(24px,3vw,32px);line-height:1.2;font-weight:800;color:var(--toile-ink)}
.toile-head h2::after{content:"";display:block;width:72px;height:4px;margin-top:12px;border-radius:2px;background:var(--toile)}
.toile-lead,.toile-sub{margin:0;font-size:16px;line-height:1.55;color:var(--toile-soft);max-width:760px}
.toile-sub{font-size:15px;margin-bottom:14px}
.toile-part{margin-top:32px}
.toile-part h3{margin:0 0 14px;font-size:20px;font-weight:800;color:var(--toile-ink)}

/* Cartes articles */
.toile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.toile-card{display:flex;flex-direction:column;background:#fff;border-radius:12px;overflow:hidden;
  box-shadow:0 1px 3px rgba(16,32,48,.08);transition:transform .15s,box-shadow .15s;color:inherit}
.toile-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(16,32,48,.12)}
.toile-card-img{display:block;aspect-ratio:16/10;background:#dde6ee center/cover no-repeat}
.toile-card-noimg{background:linear-gradient(135deg,var(--toile),#0b8bd6)}
.toile-card-body{display:flex;flex-direction:column;gap:8px;padding:16px 18px 18px;flex:1}
.toile-card-title{font-size:17px;font-weight:700;line-height:1.3;color:var(--toile-ink);overflow-wrap:anywhere}
.toile-card-ex{font-size:14px;line-height:1.5;color:var(--toile-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.toile-card-more{margin-top:auto;font-size:14px;font-weight:700;color:var(--toile)}
.toile-all{margin:18px 0 0;font-weight:700}
.toile-all a{color:var(--toile)}
.toile-all a:hover{text-decoration:underline}

/* Documentations */
.toile-btns{display:flex;flex-wrap:wrap;gap:10px}
.toile-btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:10px;background:var(--toile);color:#fff!important;
  font-size:15px;font-weight:700;line-height:1.25;transition:filter .15s,transform .15s}
.toile-btn:hover{filter:brightness(1.12);transform:translateY(-1px)}
.toile-ico{flex:0 0 18px;width:18px;height:18px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m0 0l-5-5m5 5l5-5M4 21h16'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m0 0l-5-5m5 5l5-5M4 21h16'/%3E%3C/svg%3E") center/contain no-repeat}
.toile-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 24px;margin:18px 0 0;padding:0;list-style:none}
.toile-list li{padding-left:16px;position:relative;font-size:15px;line-height:1.4}
.toile-list li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;background:var(--toile)}
.toile-list a{color:var(--toile-ink)}
.toile-list a:hover{color:var(--toile)}
.toile-plans{margin:16px 0 0;font-weight:700}
.toile-plans a{color:var(--toile)}

/* Puces métiers */
.toile-chips{display:flex;flex-wrap:wrap;gap:8px}
.toile-chip{display:inline-block;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--toile-line);
  color:var(--toile-ink)!important;font-size:14px;font-weight:600;line-height:1.25;transition:all .15s}
.toile-chip:hover{border-color:var(--toile);color:var(--toile)!important}
.toile-chip-strong{background:var(--toile);border-color:var(--toile);color:#fff!important}
.toile-chip-strong:hover{filter:brightness(1.12);color:#fff!important}
.toile-chip-all{color:var(--toile)!important;border-style:dashed}

/* Appel à l'action */
.toile-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:36px;padding:20px 24px;border-radius:12px;background:#fff;border:1px solid var(--toile-line)}
.toile-cta span{font-size:16px;font-weight:700;flex:1 1 260px}
.toile-cta-btn{padding:12px 20px;border-radius:10px;background:var(--toile);color:#fff!important;font-weight:700}
.toile-cta-tel{padding:12px 20px;border-radius:10px;border:2px solid var(--toile);color:var(--toile)!important;font-weight:700}

/* Bloc article */
.toile-article{margin:40px auto}
.toile-article .toile-head{margin-bottom:8px}
.toile-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* Index des métiers */
.toile-index{max-width:1200px;margin:24px auto}
.toile-idx-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.toile-idx{background:#fff;border:1px solid var(--toile-line);border-top:4px solid var(--toile);border-radius:10px;padding:16px 18px}
.toile-idx-title{display:block;font-size:17px;font-weight:800;color:var(--toile-ink)!important;line-height:1.3}
.toile-idx-title:hover{color:var(--toile)!important}
.toile-idx-count{display:block;margin:4px 0 8px;font-size:13px;font-weight:600;color:var(--toile)}
.toile-idx ul{margin:0;padding:0 0 0 16px}
.toile-idx li{font-size:14px;line-height:1.4;margin:4px 0}
.toile-idx li a{color:var(--toile-soft)}
.toile-idx li a:hover{color:var(--toile)}

@media (max-width:960px){
  .toile-grid,.toile-grid-3,.toile-idx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  .toile-block{padding:28px 16px;margin:32px auto;border-radius:12px}
  .toile-grid,.toile-grid-3,.toile-idx-grid,.toile-list{grid-template-columns:1fr}
  .toile-btn{width:100%}
  .toile-cta a{flex:1 1 100%;text-align:center}
}