/* Changer de logiciel (18/10) : titre et phrase à gauche, carte « 2 h » à droite, frise des trois étapes */
.ob-section{max-width:1240px;margin:auto;padding:72px 7vw 64px}
.ob-head{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:6%;align-items:end;margin-bottom:56px}
.ob-title .eyebrow{color:var(--terra);margin-bottom:12px}
.ob-section h2{margin:0;font-size:clamp(44px,4.6vw,68px)}
.ob-lede{margin:22px 0 0;max-width:560px;font-size:21px;line-height:1.45;color:var(--forest)}
.ob-card{position:relative;padding:30px 32px 28px;border-radius:22px;background:var(--forest);color:var(--cream);overflow:hidden}
.ob-card:before{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,#9d503555,transparent 70%)}
.ob-hours{margin:0;line-height:.9}
.ob-hours strong{font:400 clamp(84px,8vw,118px)/.9 var(--serif);letter-spacing:-.04em;color:#e6a184}
.ob-card-text{margin:10px 0 22px;font-size:17px;line-height:1.45;max-width:300px}
.ob-cta{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:var(--cream);color:var(--forest);font-size:14px;font-weight:500;text-decoration:none;transition:transform .25s var(--ease),background .25s}
.ob-cta:hover{transform:translateY(-2px);background:#fff}
/* Frise */
.ob-steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin:0;padding:0;list-style:none;counter-reset:none}
.ob-steps:before{content:"";position:absolute;left:22px;right:22px;top:22px;height:1px;background:var(--line)}
.ob-steps:after{content:"";position:absolute;left:22px;right:22px;top:22px;height:2px;margin-top:-.5px;background:var(--terra);transform-origin:left;transform:scaleX(1)}
.ob-steps li{position:relative;margin:0;padding:0;border:0;transition:transform .3s var(--ease)}
.ob-steps li:before{display:none}
.ob-steps .ob-dot{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin-bottom:22px;border-radius:50%;background:var(--terra);color:var(--cream);font-size:13px;letter-spacing:.06em;transition:background .5s,color .5s,box-shadow .5s}
.ob-steps h3{margin:0 0 10px;font:400 clamp(26px,2.3vw,34px)/1.1 var(--serif);letter-spacing:-.02em}
.ob-steps p{margin:0;font-size:16px;line-height:1.55;max-width:340px}
.ob-steps li:hover{transform:translateY(-3px)}
.ob-steps li:hover h3{color:var(--terra)}
.ob-section .onboarding-support{margin:44px 0 0;padding-top:18px;border-top:1px solid var(--line);font-size:14px}
/* Effets, armés par onboarding.js seulement (contenu visible sans JS) */
.ob-armed .ob-steps:after{transform:scaleX(0);transition:transform 1.4s var(--ease)}
.ob-armed .ob-steps .ob-dot{background:var(--cream);color:var(--terra);box-shadow:inset 0 0 0 1px var(--terra)}
.ob-armed .ob-steps li > :not(.ob-dot){opacity:0;transform:translateY(12px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.ob-armed .ob-card{opacity:0;transform:translateY(18px) scale(.98);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.ob-armed.ob-in .ob-steps:after{transform:scaleX(1)}
.ob-armed.ob-head-in .ob-card{opacity:1;transform:none}
.ob-armed.ob-in .ob-steps li > :not(.ob-dot){opacity:1;transform:none}
.ob-armed.ob-in .ob-steps .ob-dot{background:var(--terra);color:var(--cream);box-shadow:0 0 0 6px #9d503522}
.ob-armed.ob-in .ob-steps li:nth-child(1) > *{transition-delay:.15s}
.ob-armed.ob-in .ob-steps li:nth-child(2) > *{transition-delay:.65s}
.ob-armed.ob-in .ob-steps li:nth-child(3) > *{transition-delay:1.15s}
@media(max-width:759px){
 .ob-section{padding:48px 20px 44px}
 .ob-head{grid-template-columns:minmax(0,1fr);gap:28px;margin-bottom:36px}
 .ob-lede{font-size:18px}
 .ob-steps{grid-template-columns:minmax(0,1fr);gap:26px;padding-left:0}
 .ob-steps:before,.ob-steps:after{left:21px;right:auto;top:22px;bottom:22px;width:1px;height:auto}
 .ob-steps:after{width:2px;margin:0 0 0 -.5px;transform-origin:top}
 .ob-armed .ob-steps:after{transform:scaleY(0)}
 .ob-armed.ob-in .ob-steps:after{transform:scaleY(1)}
 .ob-steps li{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:18px}
 .ob-steps .ob-dot{grid-row:span 2;margin:0}
 .ob-steps h3{font-size:26px;margin-bottom:6px}
}
