/* Fiches des applications : même charte que l'accueil (chargé après style.css) */
:root{--sun:#ffc83d;--mint:#5be3b5;--violet:#8b9bff;--line:#2c3262}
body{color:#f5f6ff;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;
  background:
   radial-gradient(900px 520px at 85% -8%,rgba(94,118,255,.30),transparent 62%),
   radial-gradient(700px 420px at 0 22%,rgba(91,227,181,.08),transparent 62%),
   #0b0d1f;background-attachment:fixed}

/* En-tête */
body .top{padding:14px 0;background:rgba(11,13,31,.88);box-shadow:0 0 0 100vmax rgba(11,13,31,.88);clip-path:inset(0 -100vmax)}
body .top .brand{letter-spacing:.16em;font-size:.95rem;font-weight:900}
body .top .brand span{color:var(--violet)}
body .top nav a{color:#b3b9da;padding:8px 14px;border-radius:999px;transition:.2s}
body .top nav a:hover{color:#fff;background:#ffffff12}

/* Titre */
body .breadcrumbs{padding:22px 0 0;font-size:.85rem;color:#8087ae}
body .breadcrumbs a{color:#aab6ee}
body .content{max-width:960px;margin:24px 0 70px}
body .content .eyebrow{display:inline-block;margin:0 0 18px!important;padding:6px 15px!important;border:1px solid var(--line);border-radius:999px;background:#ffffff08;color:#aab6ee;font-size:.72rem!important;font-weight:800;letter-spacing:.16em}
body .content h1{margin:0 0 16px;font-size:clamp(2.3rem,5vw,3.8rem);line-height:1.05;font-weight:800;letter-spacing:-.04em;
  background:linear-gradient(100deg,#a5b8ff,#5be3b5);-webkit-background-clip:text;background-clip:text;color:transparent}
body .content .intro{max-width:760px;color:#b3b9da;font-size:1.12rem;line-height:1.65;animation:none}

/* Repères rapides */
body .keypoints{margin:28px 0;padding:22px 26px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(165deg,#181c3e,#111434);box-shadow:0 24px 50px -34px #000}
body .keypoints h2{margin:0 0 12px;padding:0;border:0;font-size:1rem;letter-spacing:.14em;text-transform:uppercase;color:var(--violet)}
body .keypoints ul{margin:0;padding-left:20px;display:grid;gap:8px;color:#dcdff5}
body .keypoints li::marker{color:var(--sun)}

/* Sections de texte */
body .content section{margin:44px 0}
body .content section h2{margin:0 0 14px;padding:2px 0 2px 14px;border-left:4px solid var(--violet);font-size:1.45rem;line-height:1.25;letter-spacing:-.01em}
body .content section h3{font-size:1.1rem;color:#cfd6ff}
body .content p{color:#c4c9e6;line-height:1.7}
body .content a{color:#aab6ff}
body .content a:hover{color:#fff}

/* Captures et clip */
body .shot-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:16px}
body .shot-grid figure,body .content figure{margin:0}
body .shot-grid img,body .content figure>img{width:100%;height:auto;border-radius:14px;border:1px solid var(--line);box-shadow:0 20px 44px -28px #000}
body figcaption{margin-top:8px;color:#8087ae;font-size:.85rem}
body .clip-box{border:1px solid var(--line);box-shadow:0 24px 50px -30px #000}

/* Étiquette « accès à venir » */
body .aside{margin:30px 0;padding:0;border:0;background:none}
body .aside .tag{display:inline-block;padding:7px 16px;border:1px solid #3a4180;border-radius:999px;background:#ffffff0a;color:#aab6ee;font-size:.82rem;font-weight:700}

/* Boutons et liens de fin de page */
body .button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 22px;border-radius:999px;background:var(--sun);color:#2a1d00;font-weight:800;text-decoration:none;transition:transform .15s,background .2s}
body .button:hover{background:#ffd866;color:#2a1d00;transform:translateY(-2px)}
body .button.secondary{background:#252b55;color:#fff}
body .button.secondary:hover{background:#313872;color:#fff}

/* Pied de page */
body footer{padding:30px 0 38px;text-align:center;color:#8087ae;font-size:.82rem;line-height:1.7;border-top:1px solid #1d2246}
body footer a{color:#aab6ee}

/* Téléphone */
body .top nav .langs a{white-space:nowrap}
@media(max-width:600px){
  body .top{gap:10px}
  body .top nav>a{display:none}
  body .top nav .langs{margin-left:0}
  body .content h1{font-size:2.3rem}
  body .keypoints{padding:18px 18px}
}
@media(max-width:600px){body .top nav .langs a:first-child{display:inline-block}}
body .content a.button{color:#2a1d00}
body .content a.button:hover{color:#2a1d00}
body .content a.button.secondary,body .content a.button.secondary:hover{color:#fff}