/* Paired explanations and live previews. */
.hero{background:transparent}
.hero .hero-background,.hero .hero-shade{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 68%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 68%,transparent 100%)}
.hero h1,.hero h1 em{font-weight:750;letter-spacing:-.045em}
#contenu{--pair-gap:clamp(20px,3vw,48px);--panel-pad:clamp(22px,2.8vw,42px);--pair-width:min(94%,1440px)}
#solutions.solutions,#methode.method,#apropos.about,.scenario.wrap,#contenu .client-showcase,#diagnostic.diagnostic-section{width:var(--pair-width);max-width:1440px;margin:64px auto;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
#solutions>.section-heading{max-width:680px;padding:var(--panel-pad);margin:0 0 28px auto;border-radius:16px;background:rgba(248,251,255,.73);border:1px solid #ffffffd9;backdrop-filter:blur(12px)}
#solutions .solution-grid{display:grid;grid-template-columns:1fr;gap:28px}
#solutions .solution-card,.scenario.wrap,#methode.method,#apropos.about,#contenu .client-showcase,#diagnostic .diagnostic-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--pair-gap);align-items:start}
#solutions .solution-card{padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.explanation-card,.scenario-explanation,.method-explanation,#apropos .about-copy,#contenu .client-showcase-heading,#diagnostic .diagnostic-intro{padding:var(--panel-pad);margin:0;min-width:0;background:rgba(248,251,255,.73);border:1px solid #ffffffde;border-radius:16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 12px 40px #25477508}
#solutions .explanation-card .card-top{margin-bottom:24px}
#solutions .explanation-card h3{margin:0 0 22px;font-size:clamp(25px,2.3vw,36px);line-height:1.12}
#solutions .explanation-card p{margin-bottom:24px}
#solutions .explanation-card .card-link{margin-top:24px}
#solutions .solution-visual{min-width:0;min-height:390px;align-self:stretch;display:grid;place-items:center;background:linear-gradient(145deg,#f9fcffb8,#c7ddff63);border:1px solid #ffffffc9;border-radius:20px;backdrop-filter:blur(5px)}
#solutions .solution-visual>div{grid-area:auto;width:240px;height:200px;margin:0;transform:scale(1.25)}
#solutions .solution-visual .automation-art{display:flex;height:180px}
#solutions .solution-visual .web-art{height:180px}
#solutions>.caption,#solutions>.application-example-link{display:block;max-width:680px;margin:22px 0 0 auto}
#contenu .client-showcase-heading{grid-column:2;grid-row:1;max-width:none}
#contenu .client-showcase>.demo-shell{grid-column:1;grid-row:1;min-width:0;width:100%;margin:0;align-self:start}
#contenu .client-showcase-heading h2{font-size:clamp(26px,2.7vw,40px);line-height:1.14}
#contenu .showcase-benefits{margin-top:24px}
#contenu .showcase-benefits li{padding:18px 0}
#contenu .client-showcase-heading p,#contenu .showcase-benefits{font-size:15px;line-height:1.75}
#contenu .client-showcase-heading .showcase-note{font-size:12px}
.scenario-visual,.method-visual{padding:var(--panel-pad);border:1px solid #ffffffde;border-radius:20px;background:linear-gradient(145deg,#f9fcffcc,#d5e7ff99);backdrop-filter:blur(8px);min-width:0}
.process-flow,.method-visual ol{list-style:none;padding:0;margin:35px 0 0;display:grid;gap:24px}
.process-flow li,.method-visual li{display:grid;grid-template-columns:54px 1fr;gap:6px 18px;position:relative;align-items:center}
.process-flow li>span,.method-visual li>span{grid-row:span 2;display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:#e9f2ff;color:#2155ed;border:1px solid #bfd5f5;font-size:20px;font-weight:700}
.process-flow li:last-child>span{background:#2155ed;color:white}
.process-flow strong,.method-visual strong{font-size:18px;font-weight:650;line-height:1.3}
.process-flow small,.method-visual small{font-size:13px;color:#50647f;display:block}
.method-visual li{gap:18px}
.method-visual li>span{grid-row:auto}
.method-visual small{margin-top:5px}
.method-visual>p:last-child{margin:32px 0 0;padding-top:24px;border-top:1px solid #b8cbe4;font-size:14px;color:#50647f}
.scenario-explanation h2{font-size:clamp(27px,2.9vw,43px);margin-bottom:28px}
.scenario-explanation>p:not(.eyebrow){font-size:15px;line-height:1.8}
#methode .section-heading{margin-bottom:24px}
#methode .steps{gap:20px}
#methode .steps h3{font-size:24px;margin:18px 0 14px}
#methode .steps p{font-size:15px;line-height:1.7}
#methode .section-heading h2,#diagnostic .diagnostic-intro h2,#apropos .about-copy h2{font-size:clamp(28px,2.9vw,42px)}
#diagnostic .diagnostic-layout{width:100%;max-width:none;margin:0;padding:0}
#diagnostic .diagnostic-intro{grid-column:2;grid-row:1}
#diagnostic .diagnostic-panel{grid-column:1;grid-row:1;min-width:0;background:#f8fbffe8;border-radius:16px}
#apropos .founder-portrait{width:100%;max-width:none;min-width:0;align-self:start;border-radius:20px;overflow:hidden}
#apropos .founder-photo{width:100%;height:auto;display:block}
#apropos .about-copy p{font-size:15px;line-height:1.8}
#apropos .values dl>div{padding:18px 0}
@media(min-width:1000px){#contenu .client-showcase>.demo-shell,.method-visual,#apropos .founder-portrait{position:sticky;top:110px}}
@media(min-width:640px) and (max-width:900px){
 #contenu{--pair-gap:18px;--panel-pad:18px}
 #solutions .solution-card,.scenario.wrap,#methode.method,#apropos.about,#contenu .client-showcase,#diagnostic .diagnostic-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
 #contenu .client-showcase-heading h2,#methode .section-heading h2,#diagnostic .diagnostic-intro h2,#apropos .about-copy h2,.scenario-explanation h2{font-size:25px;letter-spacing:-1px}
 #contenu .client-showcase-heading p,#contenu .showcase-benefits,#apropos .about-copy p,#methode .steps p,.scenario-explanation>p:not(.eyebrow),#solutions .explanation-card p,#solutions .explanation-card ul{font-size:13px}
 #solutions .solution-visual>div{transform:scale(.92)}
 #solutions .explanation-card h3{font-size:24px}
 #solutions .explanation-card .card-link{font-size:12px;gap:10px}
 .process-flow li,.method-visual li{grid-template-columns:42px 1fr;gap:6px 12px}
 .process-flow li>span,.method-visual li>span{width:42px;height:42px;font-size:16px}
 .process-flow strong,.method-visual strong{font-size:16px}
 .process-flow small,.method-visual small{font-size:12px}
 #diagnostic .diagnostic-panel{padding:22px 16px}
}
@media(max-width:639px){
 #contenu{--pair-gap:18px;--panel-pad:24px}
 #solutions.solutions,#methode.method,#apropos.about,.scenario.wrap,#contenu .client-showcase,#diagnostic.diagnostic-section{width:92%;margin:38px auto}
 #solutions .solution-card,.scenario.wrap,#methode.method,#apropos.about,#contenu .client-showcase,#diagnostic .diagnostic-layout{grid-template-columns:minmax(0,1fr)}
 #contenu .client-showcase-heading,#diagnostic .diagnostic-intro{grid-column:1;grid-row:1}
 #contenu .client-showcase>.demo-shell,#diagnostic .diagnostic-panel{grid-column:1;grid-row:2}
 #solutions .solution-visual{min-height:230px}
 #solutions .solution-visual>div{transform:scale(1)}
 #solutions>.section-heading{padding:24px}
 .scenario-explanation,.method-explanation{grid-row:1}
 #apropos .founder-portrait{max-width:100%}
 .hero h1{font-weight:750}
}
#solutions .solution-visual .hub-art{font-size:13px}
#solutions .solution-visual .hub-art>span{font-size:11px;padding:7px 10px}
#solutions .solution-visual .hub-art>b{font-size:14px}
#solutions .solution-visual .mini-node{width:52px;height:52px;font-size:25px}
#solutions .solution-visual .web-art>span{font-size:19px}