/* ProSchool UI/UX V4 — septembre 2026
   Extensions: discipline quotidienne, communication MarnComs, chatbot parents, tarification V4. */

.engagement-v4{overflow:hidden;background:linear-gradient(145deg,#f7fbf9,#edf8f3)!important;border:1px solid rgba(18,138,102,.14)!important}
.engagement-v4__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.6rem}
.engagement-v4__card{position:relative;display:flex;flex-direction:column;gap:.75rem;min-height:370px;padding:1.35rem;border-radius:22px;background:#fff;border:1px solid rgba(11,63,56,.1);box-shadow:0 14px 34px rgba(11,63,56,.07)}
.engagement-v4__card h3{margin:0;color:#0b3f38;font-size:1.12rem;line-height:1.25}
.engagement-v4__card p{margin:0;color:#607573;line-height:1.67}
.engagement-v4__card--communication{background:linear-gradient(150deg,#0b3f38,#0d584d);color:#fff;border-color:transparent}
.engagement-v4__card--communication h3,.engagement-v4__card--communication p{color:#fff}
.engagement-v4__card--communication p{color:rgba(255,255,255,.82)}
.engagement-v4__card--chatbot{background:linear-gradient(145deg,#fff,#f0f8f5)}
.engagement-v4__icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#e5f6ee;color:#128a66}
.engagement-v4__card--communication .engagement-v4__icon{background:rgba(255,255,255,.12);color:#84e3b5}
.engagement-v4__icon svg{width:25px;height:25px}
.engagement-v4__chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:auto}
.engagement-v4__chips span,.channel-flow span{padding:.45rem .62rem;border-radius:999px;background:#edf8f3;border:1px solid rgba(18,138,102,.12);font-size:.72rem;font-weight:750;color:#0b6555}
.channel-flow{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;margin:.35rem 0 .25rem}
.channel-flow span{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.13);color:#fff}
.channel-flow i{font-style:normal;color:#7be1b1}
.engagement-v4__card .button{margin-top:auto;align-self:flex-start}
.chatbot-preview{display:grid;gap:.55rem;margin-top:auto;padding:.85rem;border-radius:16px;background:#eaf6f1}
.chatbot-preview__bubble{max-width:86%;padding:.65rem .8rem;border-radius:14px;font-size:.76rem;line-height:1.45}
.chatbot-preview__bubble--parent{justify-self:end;background:#fff;color:#26463f;border-bottom-right-radius:5px;box-shadow:0 6px 18px rgba(11,63,56,.06)}
.chatbot-preview__bubble--bot{justify-self:start;background:#128a66;color:#fff;border-bottom-left-radius:5px}

/* Keep the expanded 10-card feature set balanced. */
.home-surface .commercial-feature-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
.home-surface .commercial-feature-card--uiux:nth-child(9){background:#eef9f4!important}
.home-surface .commercial-feature-card--uiux:nth-child(10){background:#f5f3fb!important}

/* Pricing V4 */
body[data-route="pricing"] .page-hero{background:linear-gradient(135deg,#eaf8f2,#f9fbfa)!important}
body[data-route="pricing"] .page-hero .meta-pill:first-child{background:#0b3f38!important;color:#fff!important;border-color:#0b3f38!important}
body[data-route="pricing"] .route-notice{border-left:4px solid #22b573;background:#eefaf5;padding:1rem 1.1rem;border-radius:14px;color:#315c52}
body[data-route="pricing"] .card-grid{gap:1rem}
body[data-route="pricing"] .info-card{min-height:220px;display:flex;flex-direction:column}
body[data-route="pricing"] .info-card .inline-actions{margin-top:auto;padding-top:1rem}
body[data-route="pricing"] .info-card h3{color:#0b3f38}

@media(max-width:1199px){
  .home-surface .commercial-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .engagement-v4__grid{grid-template-columns:1fr 1fr}
  .engagement-v4__card--chatbot{grid-column:1/-1;min-height:auto}
}
@media(max-width:767px){
  .engagement-v4{padding:1rem!important}
  .engagement-v4__grid{grid-template-columns:1fr}
  .engagement-v4__card,.engagement-v4__card--chatbot{grid-column:auto;min-height:auto}
  .home-surface .commercial-feature-grid{grid-template-columns:1fr!important}
  .channel-flow{gap:.3rem}.channel-flow i{display:none}
}


/* V4.1 — localisation automatique langue / devise */
.currency-switch {
  display: inline-flex;
  align-items: center;
  height: 32px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  color: #fff;
  overflow: hidden;
}
.currency-switch select {
  appearance: none;
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: .72rem;
  font-weight: 700;
  padding: .35rem 1.35rem .35rem .62rem;
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 10px) 50%, calc(100% - 7px) 50%;
  background-size: 3px 3px, 3px 3px;
  background-repeat: no-repeat;
}
.currency-switch option { color: #14313A; background: #fff; }
.localized-price-panel {
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr);
  gap: 24px;
  padding: clamp(24px,4vw,42px);
  background: linear-gradient(135deg,#0B3F38,#0d554a);
  color: #fff;
  border: 0;
  overflow: hidden;
  position: relative;
}
.localized-price-panel::after {
  content: "";
  position: absolute;
  width: 240px; height: 240px;
  right: -80px; top: -100px;
  border-radius: 50%;
  background: rgba(34,181,115,.18);
  pointer-events: none;
}
.localized-price-panel h2 { color:#fff; margin:.7rem 0 .2rem; }
.localized-price-panel p { color:rgba(255,255,255,.82); }
.localized-price-panel__range {
  color:#fff !important;
  font-size: clamp(1.8rem,4vw,3.2rem);
  line-height:1.08;
  font-weight:800;
  letter-spacing:-.035em;
  margin:.5rem 0 1rem;
}
.localized-price-panel__facts { display:grid; gap:10px; align-content:center; position:relative; z-index:1; }
.localized-price-panel__facts div { padding:14px 16px; border-radius:16px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.12); display:grid; gap:3px; }
.localized-price-panel__facts strong { font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:#8de4bd; }
.localized-price-panel__facts span { font-weight:700; color:#fff; }
.fx-attribution { grid-column:1/-1; font-size:.72rem; margin:0; position:relative; z-index:1; }
.fx-attribution a { color:#a7f0cf; }
@media (max-width: 900px) {
  .localized-price-panel { grid-template-columns:1fr; }
}
@media (max-width: 720px) {
  .currency-switch { height:30px; }
  .currency-switch select { font-size:.68rem; padding-left:.5rem; }
}


/* ================================================================
   PROSCHOOL V6 — téléchargements, architecture réseau et Démo
   Extension du design actuel, sans changement de charte.
   ================================================================ */
.download-architecture-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:1rem;
  margin:1rem 0 1.15rem;
}
.download-architecture-card{
  padding:1.2rem;
  border:1px solid var(--ui-border);
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 30px rgba(11,63,56,.06);
}
.download-architecture-card--network{background:linear-gradient(145deg,#fff,#f0f9f4)}
.download-architecture-card--standalone{background:linear-gradient(145deg,#fff,#f3f7fb)}
.download-architecture-card__title{display:flex;align-items:center;gap:.8rem;margin-bottom:.9rem}
.download-architecture-card__title .ui-icon{width:42px;height:42px;padding:9px;border-radius:13px;background:#e7f6ed;color:#176f46}
.download-architecture-card__title span{display:block;color:#6d827b;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;font-weight:800}
.download-architecture-card__title strong{display:block;color:#173f39;font-size:1.05rem}
.download-architecture-card>p{margin:.8rem 0 0;color:#5f7570;font-size:.88rem;line-height:1.58}
.network-flow,.standalone-flow{display:flex;align-items:center;justify-content:center;gap:.6rem}
.network-flow>div,.standalone-flow>div{flex:1;min-width:0;padding:.72rem;border-radius:13px;background:#fff;border:1px solid rgba(16,101,73,.12);text-align:center}
.network-flow__server{background:linear-gradient(145deg,#0c604f,#0b4039)!important;color:#fff}
.network-flow__server b,.network-flow__server small{color:#fff!important}
.network-flow b,.standalone-flow b{display:block;color:#153f39;font-size:.82rem}
.network-flow small,.standalone-flow small{display:block;margin-top:.15rem;color:#758883;font-size:.66rem}
.network-flow>span,.standalone-flow>span{color:#1b9c60;font-weight:900}
.downloads-overview__aside--demo .ghost-button{margin-top:.8rem}
.download-experience-grid--profiles{grid-template-columns:repeat(5,minmax(0,1fr))}
.download-experience-card--demo{background:linear-gradient(145deg,#fffaf0,#fff);border-color:rgba(209,145,42,.25)}
.download-experience-card--demo>svg{background:#fff3d7;color:#a86600}
.download-guidance-strip--network{margin-bottom:1.35rem}
.download-catalog--profiles{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.download-group--standalone .download-catalog--profiles{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.download-card--profile{scroll-margin-top:7.8rem;min-height:100%}
.download-card--featured-demo{border-color:rgba(211,147,35,.26)!important;background:linear-gradient(145deg,#fffdf8,#fff8e9)!important}
.download-card--featured-demo::before{background:linear-gradient(90deg,#e7a52d,#22b573)!important}
.profile-tech-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:.85rem 0}
.profile-tech-list span{display:flex;flex-direction:column;gap:.16rem;min-width:0;padding:.62rem .7rem;border-radius:11px;background:#f4f8f7;border:1px solid rgba(20,93,72,.08);color:#5d716c;font-size:.74rem}
.profile-tech-list strong{color:#214c43;text-transform:uppercase;letter-spacing:.04em;font-size:.61rem}
.profile-tech-list code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#126346;background:transparent;padding:0;font-weight:800}
.download-integrity{display:flex;flex-wrap:wrap;gap:.45rem .85rem;color:#667b76;font-size:.72rem;margin:.55rem 0}
.demo-safety-note{display:flex;gap:.45rem;align-items:flex-start;padding:.7rem .75rem;margin:.65rem 0;border-radius:12px;background:#fff2d9;border:1px solid rgba(183,117,13,.14);color:#72501c;font-size:.73rem}
.demo-safety-note strong{white-space:nowrap;color:#8a5b0a}
.download-other-access-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.download-other-access-card{padding:1rem 1.05rem;border-radius:16px;border:1px solid var(--ui-border);background:#fff}
.download-other-access-card strong{display:block;color:#17463e}
.download-other-access-card p{color:#687d78;font-size:.82rem;line-height:1.55}

@media(max-width:1100px){
  .download-experience-grid--profiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .download-catalog--profiles{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .download-architecture-grid{grid-template-columns:1fr}
  .download-experience-grid--profiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .download-catalog--profiles,.download-group--standalone .download-catalog--profiles{grid-template-columns:1fr!important}
  .download-other-access-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .download-experience-grid--profiles{grid-template-columns:1fr}
  .profile-tech-list{grid-template-columns:1fr}
  .network-flow{display:grid;grid-template-columns:1fr;gap:.35rem}
  .network-flow>span{transform:rotate(90deg)}
}
