/* The complete operating model, with its original shadows and solid surfaces. */
.home-clarity .sites-introduction { grid-template-columns:minmax(0,.87fr) minmax(0,1.25fr); gap:clamp(30px,4vw,64px); }
.home-clarity .sites-overview { margin:0 -3% 0 0; min-width:0; }
.home-clarity .sites-overview img { display:block; width:100%; height:auto; mix-blend-mode:normal; opacity:1; filter:none; }
.sites-overview-labels { display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:9%; align-items:start; padding:0 2.5% 20px; }
.sites-overview-labels > span { font:500 clamp(18px,1.5vw,23px)/1.4 Manrope,Arial,sans-serif; color:var(--white); }
.sites-overview-labels > span:last-child { display:flex; align-items:flex-start; gap:11px; }
.sites-overview-labels .flag { width:24px; height:16px; margin-top:6px; }
/* A single route connects three stages. Copy never depends on hover or animation. */
.home-clarity .engagement .section-heading { margin-bottom:64px; }
.workflow { position:relative; isolation:isolate; --workflow-progress:1; }
.workflow::before { content:''; position:absolute; top:113px; left:7px; width:calc(66.666% + 6px); height:4px; background:#596750; }
.workflow.is-enhanced::before { display:none; }
.workflow-route { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:-1; display:none; }
.workflow.is-enhanced .workflow-route { display:block; }
.workflow-route path { fill:none; stroke-width:4; stroke-linecap:butt; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.workflow-track { stroke:#56614c; }
.workflow-progress { stroke:var(--orange); stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--workflow-progress)); }
.workflow-steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(32px,5vw,80px); }
.workflow-step { position:relative; min-width:0; }
.workflow-step-heading { display:flex; flex-direction:column; }
.workflow-number { display:block; font:600 90px/.94 'Barlow Condensed',sans-serif; letter-spacing:-.025em; color:var(--orange); margin-bottom:73px; transition:color 220ms ease; }
.workflow.is-enhanced .workflow-step:not(.is-reached) .workflow-number { color:#86917d; }
.workflow-node { position:absolute; top:108px; left:0; width:14px; height:14px; border:3px solid var(--orange); background:var(--orange); border-radius:50%; box-shadow:0 0 0 7px #141914; transition:background-color 220ms ease,border-color 220ms ease; }
.workflow.is-enhanced .workflow-step:not(.is-reached) .workflow-node { border-color:#718064; background:#141914; }
html .home-clarity .workflow h3 { font:600 clamp(37px,3.4vw,54px)/1.06 var(--display); letter-spacing:-.012em; margin:0; text-transform:none; min-height:2.14em; overflow-wrap:normal; hyphens:auto; }
.home-clarity .workflow p { color:#bdc6b6; font-size:18px; line-height:1.65; margin-top:22px; max-width:400px; }
html[lang=uk] .home-clarity .workflow h3 { font-size:clamp(31px,2.6vw,42px); line-height:1.2; min-height:2.45em; }
@media(hover:hover) {
 .workflow-step:hover .workflow-number { color:var(--orange) !important; }
 .workflow-step:hover .workflow-node { border-color:var(--orange) !important; background:var(--orange) !important; }
}
@media(min-width:761px) and (max-width:1000px) {
 .home-clarity .sites-introduction { grid-template-columns:1fr; }
 .home-clarity .sites-introduction-copy { max-width:650px; }
 .home-clarity .sites-overview { width:100%; max-width:850px; margin:20px 0 0; }
 .sites-overview-labels > span { font-size:21px; }
 .workflow-steps { gap:26px; }
 html .home-clarity .workflow h3 { font-size:36px; }
 .home-clarity .workflow p { font-size:17px; }
}
@media(max-width:760px) {
 .home-clarity .sites-introduction { grid-template-columns:1fr; gap:44px; padding-bottom:58px; }
 .home-clarity .sites-overview { margin:0 -8px; }
 .sites-overview-labels { padding:0 8px 12px; gap:12%; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
 .sites-overview-labels > span { font-size:17px; line-height:1.4; }
 .sites-overview-labels > span:last-child { flex-direction:column; gap:8px; }
 .sites-overview-labels .flag { width:24px; height:16px; margin:0; }
 .home-clarity .engagement .section-heading { margin-bottom:46px; }
 .workflow-steps { grid-template-columns:1fr; gap:52px; }
 .workflow-step { padding-left:47px; }
 .workflow-step-heading { display:flex; flex-direction:row; align-items:baseline; gap:16px; }
 .workflow-number { font-size:36px; line-height:1; margin:0; flex-shrink:0; }
 .workflow-node { top:18px; width:13px; height:13px; border-width:3px; }
 html .home-clarity .workflow h3 { font-size:clamp(34px,7.9vw,48px); line-height:1.1; min-height:0; }
 .home-clarity .workflow p { font-size:17px; margin-top:19px; }
 .workflow::before { top:24px; bottom:60px; left:5px; width:4px; height:auto; }
 html[lang=uk] .home-clarity .workflow h3 { font-size:clamp(28px,6.5vw,40px); line-height:1.2; min-height:0; }
 html[lang=uk] .workflow-step-heading { gap:12px; }
}
@media(prefers-reduced-motion:reduce) {
 .workflow-number,.workflow-node { transition:none; }
}
html[lang=de] .sites-overview-labels > span { hyphens:auto; overflow-wrap:break-word; }