/* Secondary marketing pages share SOMA's application palette and main navigation. */
.subpage-main { padding-bottom:20px }
.subpage-hero { padding-block:76px 52px; text-align:center }
.subpage-hero h1 { font-family:var(--sans); font-size:clamp(34px,4.7vw,58px); line-height:1.14; letter-spacing:-2px; margin:15px 0 22px; font-weight:750 }
.subpage-hero h1 em { color:var(--primary); font-style:normal }
.subpage-hero>p:last-child { font-size:16px; line-height:1.8; color:var(--text); margin:0 }
.site-header nav [aria-current="page"] { color:var(--primary) }
.page-pill { display:inline-block; background:var(--primary-light); color:var(--primary-hover); padding:6px 12px; border:1px solid var(--primary-soft); border-radius:100px; font-size:11px; font-weight:650; line-height:1.6 }
.pricing-card { display:grid; grid-template-columns:1fr 1fr; background:var(--surface); border:1px solid var(--line); border-radius:24px; box-shadow:0 15px 45px #0f172a06; overflow:hidden }
.pricing-intro { padding:40px 44px }
.pricing-intro h2 { font:700 29px/1.28 var(--sans); letter-spacing:-.8px; margin:25px 0 18px }
.pricing-value { font-size:47px; font-weight:750; color:var(--primary); line-height:1.2; letter-spacing:-1.6px; margin:0 0 18px }
.pricing-description { font-size:14px; line-height:1.8; color:var(--text); margin:0 0 26px; max-width:350px }
.pricing-intro .button { font-size:13px }
.pricing-note { font-size:11px; line-height:1.6; color:var(--muted); margin:15px 0 0 }
.pricing-needs { padding:45px 42px; background:var(--primary-light); border-left:1px solid var(--line) }
.pricing-needs h3 { font-size:17px; line-height:1.4; margin:0 0 8px; letter-spacing:-.3px }
.pricing-needs>p { font-size:13px; color:var(--text); margin:0 }
.scope-list { display:grid; gap:28px; padding:0; margin:32px 0 0; list-style:none }
.scope-list li { display:flex; gap:14px; align-items:start }
.scope-number { display:grid; place-items:center; flex:0 0 32px; height:32px; color:var(--primary-hover); background:var(--surface); border:1px solid var(--primary-soft); border-radius:9px; font-size:11px; font-weight:700 }
.scope-list strong { display:block; font-size:13px; margin-bottom:5px }
.scope-list p { font-size:12px; color:var(--text); line-height:1.8; margin:0 }
.value-section { padding-top:90px }
.value-section .section-heading { margin-bottom:34px }
.value-section h2 { font-size:37px }
.value-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px }
.value-grid article { padding:25px; border:1px solid var(--line); border-radius:17px; background:var(--surface) }
.value-icon { display:inline-grid; width:34px; height:34px; place-items:center; background:var(--primary-light); border-radius:9px; color:var(--primary); font-weight:700; font-size:11px }
.value-grid h3 { font-size:16px; margin:17px 0 10px; line-height:1.5; letter-spacing:-.25px }
.value-grid p { font-size:13px; color:var(--text); line-height:1.8; margin:0 }
.page-callout { margin-top:60px; padding:32px 38px; border:1px solid var(--line); border-radius:20px; display:flex; align-items:center; justify-content:space-between; gap:25px }
.page-callout h2 { font-size:28px; line-height:1.3; margin:0 0 8px; letter-spacing:-.7px }
.page-callout p:not(.eyebrow) { font-size:13px; margin:0; color:var(--text) }
.page-callout .button { flex-shrink:0; font-size:12px }
.footer-links { display:flex; gap:18px; flex-wrap:wrap; font-size:11px; color:var(--text) }
.footer-links a:hover { color:var(--primary) }
@media(max-width:900px) { .pricing-intro,.pricing-needs { padding:32px } .value-grid { gap:15px } .value-grid article { padding:22px } }
@media(max-width:720px) { .subpage-hero { padding-block:53px 35px } .subpage-hero h1 { letter-spacing:-1.2px } .subpage-hero>p:last-child { font-size:14px } .pricing-card { grid-template-columns:1fr } .pricing-needs { border-left:0; border-top:1px solid var(--line) } .pricing-intro,.pricing-needs { padding:28px } .pricing-intro h2 { font-size:26px } .pricing-value { font-size:40px } .value-section { padding-top:60px } .value-section h2 { font-size:29px } .value-grid { grid-template-columns:1fr } .page-callout { flex-direction:column; align-items:flex-start; padding:27px; margin-top:40px } .page-callout h2 { font-size:25px } .footer-links { justify-content:center } }
@media(max-width:400px) { .subpage-hero h1 { font-size:30px; letter-spacing:-1px } .pricing-intro,.pricing-needs { padding:22px } .page-pill { font-size:10px } .pricing-intro .button { width:100%; font-size:12px } }

/* Trois offres publiques : prix exacts, facturation annuelle, aucun paiement simulé. */
.visually-hidden {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.pricing-hero {padding-bottom:64px}
.plans-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.plan-card {position:relative;min-width:0;display:flex;flex-direction:column;padding:30px 25px;border:1px solid var(--line);border-radius:19px;background:#fff;box-shadow:0 7px 24px #0f172a03}
.plan-featured {border:2px solid var(--primary);padding:29px 24px;box-shadow:0 14px 36px -18px #6366f160}
/* Espace Pro mis en avant (intra-entreprise) : même bandeau que l'offre Organisme, en noir. */
.plan-featured-noir {border:2px solid #111827;padding:29px 24px;box-shadow:0 14px 36px -18px #11182755}
.plan-ribbon.plan-ribbon-noir {background:#111827}
.plan-ribbon {position:absolute;top:-13px;left:24px;right:24px;text-align:center;background:var(--primary);color:#fff;border:4px solid var(--paper);border-radius:50px;font-size:8px;letter-spacing:.8px;font-weight:650;padding:5px 8px;white-space:nowrap}
.plan-heading {min-height:161px}
.plan-kicker {display:block;font-size:8px;line-height:1.5;letter-spacing:1.1px;color:var(--muted);font-weight:700;margin:5px 0 13px}
.plan-featured .plan-kicker {color:var(--primary)}
.plan-heading h3 {font-family:var(--display);font-size:25px;font-weight:700;line-height:1.2;letter-spacing:-.75px;min-height:60px;margin:0 0 12px}
.plan-heading p {font-size:12px;color:var(--text);line-height:1.8;margin:0;max-width:310px}
.plan-amount {margin:21px 0 24px;min-height:76px}
.plan-price {display:flex;align-items:baseline;gap:6px;white-space:nowrap;margin:0;line-height:1.25;color:var(--ink)}
.plan-price strong {font-size:40px;font-weight:750;letter-spacing:-1.7px;line-height:1.2}
.plan-price>span {font-size:23px;font-weight:600;color:var(--ink)}
.plan-price>small {font-size:11px;color:var(--muted);font-weight:400;margin-left:2px}
.plan-price>.plan-ht {font-weight:600;color:var(--ink);margin-left:0}
.plan-featured .plan-price strong {color:var(--primary)}
.plan-alternative {font-size:11px;color:var(--muted);line-height:1.65;margin:8px 0 0}
.plan-quote strong {font-size:34px;letter-spacing:-1px}
.plan-button {display:flex;align-items:center;justify-content:space-between;gap:6px;width:100%;font-size:11px;padding:12px 15px;min-height:44px;border-radius:9px;line-height:1.4}
.plan-allowance {display:flex;flex-direction:column;gap:4px;margin:24px 0 20px;padding-top:22px;border-top:1px solid var(--line)}
.plan-allowance strong {font-size:12px;font-weight:700;line-height:1.5}
.plan-allowance>span {font-size:10px;color:var(--muted);line-height:1.6}
.plan-features {display:grid;gap:12px;list-style:none;padding:0;margin:0;font-size:11px;line-height:1.65;color:var(--text)}
.plan-features li {position:relative;padding-left:22px}
.plan-features li.plan-features-intro {padding-left:0;font-weight:700}
.plan-features li.plan-features-intro::before {content:none}
.plan-featured .plan-features-intro {color:var(--primary)}
.plan-features strong {font-weight:700}
.plan-features li::before {content:'✓';display:grid;place-items:center;width:14px;height:14px;position:absolute;left:0;top:2px;color:var(--primary);font-size:11px;font-weight:700;background:var(--primary-light);border-radius:50%}
.pricing-help {display:flex;align-items:center;justify-content:space-between;gap:30px;padding:32px 37px;border:1px solid var(--line);border-radius:17px;margin-top:52px;background:#fff}
.pricing-help>div {max-width:700px}
.pricing-help .eyebrow {font-size:8px;margin-bottom:12px}
.pricing-help h2 {font-size:26px;line-height:1.35;letter-spacing:-.7px;margin:0 0 13px}
.pricing-help p:last-child {font-size:12px;line-height:1.85;margin:0;color:var(--text)}
.pricing-help .button {flex-shrink:0;font-size:11px}
@media(max-width:1100px) {
  .plans-grid {gap:15px}
  .plan-card {padding:27px 19px}
  .plan-featured, .plan-featured-noir {padding:26px 18px}
  .plan-heading {min-height:166px}
  .plan-heading h3 {font-size:23px}
  .plan-heading p {font-size:11px}
  .plan-price strong {font-size:35px;letter-spacing:-1.2px}
  .plan-price>span {font-size:20px}
  .plan-price>small {font-size:10px}
  .plan-quote strong {font-size:31px}
  .plan-button {font-size:10px;padding-inline:12px}
  .plan-allowance strong {font-size:11px}
  .plan-ribbon {left:13px;right:13px;font-size:7px}
  .pricing-help {padding:28px}
}
@media(max-width:900px) {
  .plans-grid {grid-template-columns:minmax(0,1fr);max-width:550px;margin-inline:auto;gap:30px}
  .plan-card {padding:28px}
  .plan-featured, .plan-featured-noir {padding:27px}
  .plan-heading {min-height:0}
  .plan-heading h3 {min-height:0;margin-bottom:12px;font-size:26px}
  .plan-heading p {font-size:13px;max-width:none}
  .plan-price strong {font-size:43px}
  .plan-price>span {font-size:24px}
  .plan-price>small {font-size:12px}
  .plan-amount {margin-block:23px;min-height:0}
  .plan-alternative {font-size:12px}
  .plan-button {font-size:12px;min-height:46px}
  .plan-allowance strong {font-size:13px}
  .plan-allowance>span {font-size:11px}
  .plan-features {font-size:12px;gap:12px}
  .plan-ribbon {left:25px;right:25px;font-size:8px}
  .pricing-help {flex-direction:column;align-items:flex-start;gap:23px}
}
@media(max-width:400px) {
  .pricing-hero {padding-bottom:44px}
  .plan-card {padding:25px 22px}
  .plan-featured, .plan-featured-noir {padding:24px 21px}
  .plan-heading h3 {font-size:25px}
  .plan-heading p {font-size:12px}
  .plan-price {gap:5px}
  .plan-price strong {font-size:37px;letter-spacing:-1.3px}
  .plan-price>span {font-size:21px}
  .plan-price>small {font-size:10px}
  .plan-alternative {font-size:11px}
  .plan-button {font-size:11px}
  .plan-allowance strong {font-size:12px}
  .plan-features {font-size:11px}
  .pricing-help {padding:25px 22px}
  .pricing-help h2 {font-size:24px}
}

/* Contact direct : chiffres fournis par SOMA, coordonnées accessibles sans JavaScript. */
.contact-hero {padding-bottom:35px}
.contact-simple {padding-bottom:30px}
.contact-stats {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 42px;padding:28px 0;gap:20px}
.contact-stat {display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.contact-stat+.contact-stat {border-left:1px solid var(--line)}
.contact-stat dt {font-size:13px;line-height:1.5;color:var(--text)}
.contact-stat dd {order:-1;margin:0 0 9px;font-family:var(--display);font-size:clamp(36px,4.5vw,52px);font-weight:750;letter-spacing:-1.8px;line-height:1.2;color:var(--primary)}
.contact-direct {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;font-style:normal}
.contact-channel {display:flex;align-items:center;gap:17px;min-width:0;padding:28px 24px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 30px #0f172a04;transition:border-color .18s,box-shadow .18s}
.contact-channel:hover {border-color:var(--primary-soft);box-shadow:0 8px 30px #6366f112}
.contact-symbol {display:grid;place-items:center;flex:0 0 46px;height:46px;background:var(--primary-light);border-radius:13px;color:var(--primary)}
.contact-details {display:flex;flex-direction:column;gap:4px;min-width:0}
.contact-label {font-size:12px;color:var(--muted)}
.contact-details strong {font-size:18px;line-height:1.5;letter-spacing:-.3px;overflow-wrap:anywhere}
.contact-arrow {margin-left:auto;color:var(--primary);font-size:22px;flex-shrink:0}
@media(max-width:720px) {
  .contact-hero {padding-bottom:20px}
  .contact-stats {gap:10px;padding:22px 0;margin-bottom:26px}
  .contact-stat dt {font-size:11px;max-width:110px}
  .contact-stat dd {font-size:36px;letter-spacing:-1.2px}
  .contact-direct {grid-template-columns:1fr;gap:14px}
  .contact-channel {padding:24px}
}
@media(max-width:400px) {
  .contact-stats {gap:7px}
  .contact-stat dd {font-size:31px}
  .contact-stat dt {font-size:10px}
  .contact-channel {padding:21px 17px;gap:12px}
  .contact-symbol {flex-basis:39px;height:39px}
  .contact-details strong {font-size:16px}
}
@media(prefers-reduced-motion:reduce) {.contact-channel {transition:none}}

/* Bascule mensuel / annuel des offres (rétablie le 16 octobre 2026) et grille de quatre offres. */
.pricing-hero {padding-bottom:32px}
.billing-controls {text-align:center;margin-bottom:46px}
.billing-toggle {display:inline-flex;gap:4px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:50px}
.billing-toggle button {border:0;background:transparent;color:var(--text);padding:10px 24px;border-radius:50px;font-size:12px;font-weight:650;min-width:105px;min-height:39px;cursor:pointer}
.billing-toggle button[aria-pressed="true"] {background:var(--primary);color:#fff;box-shadow:0 3px 10px #6366f127}
.billing-toggle button:hover:not([aria-pressed="true"]) {background:var(--primary-light)}
.billing-controls>p {font-size:11px;color:var(--muted);margin:12px 0 0}
.plans-grid[data-visibles="4"] {grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1180px) { .plans-grid[data-visibles="4"] {grid-template-columns:repeat(2,minmax(0,1fr))} }
/* Vue mensuelle : les offres payables à l'année seulement sont masquées. */
.plans-grid [data-annuel-seul][hidden] {display:none}
/* Apparition / disparition des offres annuelles au changement de périodicité (pricing.js). */
.plans-grid [data-annuel-seul] {transition:opacity .24s ease, transform .24s cubic-bezier(.2,.7,.3,1)}
.plans-grid .plan-sortie {opacity:0;transform:scale(.96)}
.plans-grid .plan-entree {opacity:0;transform:translateY(12px)}
@media (prefers-reduced-motion: reduce) { .plans-grid [data-annuel-seul] {transition:none} }
.plans-grid[data-visibles="2"] {grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px;margin-inline:auto}
@media(max-width:1000px) { .plans-grid[data-visibles="3"] {grid-template-columns:repeat(2,minmax(0,1fr))} }
@media(max-width:720px) { .billing-controls {margin-bottom:37px} .billing-controls>p {font-size:10px} }
@media(max-width:900px) { .plans-grid[data-visibles] {grid-template-columns:minmax(0,1fr);max-width:550px} }
.plan-card [hidden] {display:none}
/* Offres pour organisme réunies dans une carte, curseurs formateurs / apprenants (28 octobre 2026). */
.plan-curseurs {display:grid;gap:6px;margin:-8px 0 20px;padding:9px 12px;border:1px solid var(--line);border-radius:11px;background:var(--paper)}
.plan-curseur {display:grid;grid-template-columns:74px minmax(0,1fr) 62px;align-items:center;gap:8px;min-height:30px}
.plan-curseur label {font-size:11px;font-weight:650;color:var(--ink)}
.plan-curseur-valeur {font-size:11px;font-weight:700;color:var(--primary);text-align:right;white-space:nowrap}
.plan-curseur input[type=range] {-webkit-appearance:none;appearance:none;width:100%;height:24px;margin:0;background:transparent;cursor:pointer;--avance:0%}
.plan-curseur input[type=range]::-webkit-slider-runnable-track {height:4px;border-radius:4px;background:linear-gradient(90deg,var(--primary) var(--avance),var(--primary-soft) var(--avance))}
.plan-curseur input[type=range]::-moz-range-track {height:4px;border-radius:4px;background:linear-gradient(90deg,var(--primary) var(--avance),var(--primary-soft) var(--avance))}
.plan-curseur input[type=range]::-webkit-slider-thumb {-webkit-appearance:none;appearance:none;width:16px;height:16px;margin-top:-6px;border-radius:50%;background:#fff;border:3px solid var(--primary);box-shadow:0 2px 6px #6366f140;transition:transform .15s}
.plan-curseur input[type=range]::-moz-range-thumb {width:10px;height:10px;border-radius:50%;background:#fff;border:3px solid var(--primary);box-shadow:0 2px 6px #6366f140}
.plan-curseur input[type=range]:active::-webkit-slider-thumb {transform:scale(1.15)}
.plan-curseur input[type=range]:focus-visible {outline:2px solid var(--primary);outline-offset:2px;border-radius:6px}
.plan-note {font-size:10px;line-height:1.6;color:var(--muted);margin:20px 0 0;padding-top:14px;border-top:1px solid var(--line)}
/* Chargement des offres depuis le catalogue (21 octobre 2026). */
.pricing-etat {text-align:center;color:var(--muted);font-size:14px;margin:24px 0}
.pricing-etat[hidden] {display:none}
/* Anneau de chargement des offres (28 octobre 2026) : arc dégradé qui tourne, piste claire. */
.pricing-etat.is-chargement {display:flex;flex-direction:column;align-items:center;gap:16px;margin:56px 0}
.pricing-anneau {position:relative;width:52px;height:52px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 12%,var(--primary-soft) 40%,var(--primary) 100%);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 5px));mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 5px));animation:pricing-tour 1s linear infinite}
.pricing-anneau::after {content:'';position:absolute;top:0;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--primary)}
.pricing-etat.is-chargement::before {content:'';position:absolute;width:52px;height:52px;border-radius:50%;border:5px solid var(--primary-light);box-sizing:border-box}
.pricing-etat.is-chargement {position:relative}
@keyframes pricing-tour {to {transform:rotate(1turn)}}
@media (prefers-reduced-motion: reduce) { .pricing-anneau {animation-duration:3s} }
