/* A quieter editorial frame; both themes keep the same layout and controls. */
:root body.cohesive-site.modern-layout {
  --section-corner:24px;
  --panel-corner:16px;
  --inset-corner:10px;
}
:root body.cohesive-site.modern-layout .shared-hero {
  grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr);
  align-items:center;
  gap:clamp(36px,5vw,72px);
  padding-block:72px 64px;
}
:root body.cohesive-site.modern-layout .shared-hero h1 {
  font-size:clamp(40px,4.5vw,64px);
  font-weight:600;
  line-height:1.055;
  letter-spacing:-.052em;
  max-width:16ch;
  margin-block:0 26px;
  text-wrap:balance;
}
:root body.cohesive-site.modern-layout .shared-hero .hero-description {
  max-width:43ch;
  font-size:17px;
  line-height:1.75;
  margin-block:0 32px;
}
:root body.cohesive-site.modern-layout .shared-hero .actions { gap:10px; }
:root body.cohesive-site.modern-layout .shared-hero .button {
  min-height:46px;
  padding:13px 19px;
  border-radius:10px;
  font-size:13px;
  font-weight:600;
  line-height:1.4;
}
:root:not([data-theme="dark"]) body.cohesive-site.modern-layout .shared-hero .button:not(.button-light) {
  background:#283322;
  border-color:#283322;
  color:#fff;
}
:root body.cohesive-site.modern-layout .shared-hero .button-light {
  background:transparent;
  border:1px solid var(--edge);
  color:var(--text);
}
:root body.cohesive-site.modern-layout .shared-hero>.development-world {
  background:var(--surface-section);
  border:1px solid var(--edge);
  border-radius:24px;
  align-self:center;
  overflow:hidden;
}
:root:not([data-theme="dark"]) body.cohesive-site.modern-layout .shared-hero>.development-world {
  background:#f3f5ef;
  border-color:#dfe5d7;
}
:root body.cohesive-site.modern-layout .shared-hero .environment-story { padding:28px 30px 26px; }
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-window { height:auto;min-height:444px;overflow:visible; }
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-slide {
  position:relative;
  inset:auto;
  height:auto;
  grid-template-rows:258px auto;
  gap:24px;
}
:root body.cohesive-site.modern-layout .shared-hero .slide-explanation h3 {
  font-size:clamp(23px,2vw,28px);
  line-height:1.2;
  letter-spacing:-.035em;
  font-weight:600;
  margin-block:0 12px;
}
:root body.cohesive-site.modern-layout .shared-hero .slide-explanation p {
  font-size:14px;
  line-height:1.7;
  margin-block:0 18px;
  max-width:48ch;
}
:root body.cohesive-site.modern-layout .shared-hero .slide-explanation .text-link {
  font-size:13px;
  font-weight:600;
  gap:9px;
}
:root body.cohesive-site.modern-layout .shared-hero :is(.connector-constellation,.slide-company-diagram,.monitoring-timeline) {
  height:258px;
  overflow:visible;
}
:root body.cohesive-site.modern-layout .shared-hero .slide-company-diagram>.generated-green-art {
  width:100%;
  height:250px;
  max-width:310px;
}
:root body.cohesive-site.modern-layout .shared-hero .local-collection .constellation-field {
  width:258px;
  max-width:100%;
  aspect-ratio:1;
}
:root body.cohesive-site.modern-layout .shared-hero .constellation-links {
  stroke:#98aa83;
  stroke-width:2.7;
  stroke-linecap:round;
}
:root body.cohesive-site.modern-layout .shared-hero .collect-center { width:60%;height:49%; }
:root body.cohesive-site.modern-layout .shared-hero .modern-collection-art { width:100%;height:100%;overflow:visible; }
:root body.cohesive-site.modern-layout .shared-hero .connector-node {
  width:36px;
  height:36px;
  background:none;
  border:0;
  border-radius:0;
  box-shadow:none;
}
:root body.cohesive-site.modern-layout .shared-hero .connector-node .modern-connector-logo {
  display:block;
  width:28px;
  height:28px;
  object-fit:contain;
  filter:none;
}
:root body.cohesive-site.modern-layout .shared-hero [data-connector="salesforce"] .modern-connector-logo { width:34px;height:29px; }
:root body.cohesive-site.modern-layout .shared-hero [data-connector="gmail"] .modern-connector-logo { width:29px;height:25px; }
:root body.cohesive-site.modern-layout .shared-hero [data-connector="notion"] .modern-connector-logo { width:26px;height:27px; }
:root body.cohesive-site.modern-layout .shared-hero .modern-monitoring-art { width:100%;height:auto;max-width:350px;max-height:258px; }
:root[data-theme="dark"] body.cohesive-site.modern-layout .shared-hero .hero-pixel-art { height:250px;max-width:290px; }
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls {
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:6px;
  padding-block-start:20px;
}
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls button {
  border-radius:8px;
  border-color:transparent;
  padding:10px 11px;
  font-size:11px;
  font-weight:500;
  line-height:1.35;
  min-height:36px;
  max-width:100%;
}
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls button:hover { background:var(--surface-panel); }
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls button[aria-pressed="true"] {
  background:var(--accent);
  color:#25301e;
  border-color:transparent;
  font-weight:600;
}
/* Use space instead of another outer box for the editorial sections. */
:root body.cohesive-site.modern-layout :is(.data-story,.monitoring-story) {
  padding:24px 0;
  margin-block:40px 64px;
  background:transparent;
  border:0;
  border-radius:0;
}
:root body.cohesive-site.modern-layout :is(.workflow-heading,.simulation-story>.section-heading) {
  gap:48px;
  margin-block-end:36px;
}
:root body.cohesive-site.modern-layout :is(.workflow-heading h2,.simulation-story>.section-heading h2) {
  font-size:clamp(30px,3.1vw,42px);
  font-weight:600;
  line-height:1.16;
  letter-spacing:-.04em;
}
:root body.cohesive-site.modern-layout .toolkit-overview {
  background:transparent;
  border:0;
  border-radius:0;
  margin-block:16px 28px;
  gap:20px;
}
:root body.cohesive-site.modern-layout .toolkit-overview a {
  padding:16px 0;
  border:0;
  gap:12px;
  font-size:14px;
  font-weight:600;
}
:root body.cohesive-site.modern-layout .toolkit-overview a:hover { background:transparent;color:var(--text-secondary); }
:root body.cohesive-site.modern-layout .toolkit-overview a>span:first-child {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  background:var(--surface-section);
  color:var(--text-secondary);
  flex:none;
  font-size:10px;
}
:root body.cohesive-site.modern-layout .local-computer { border-radius:18px; }
:root body.cohesive-site.modern-layout .local-protection-layout { padding:36px;gap:40px; }
:root body.cohesive-site.modern-layout .local-setup-flow { margin-block:0 8px; }
:root body.cohesive-site.modern-layout .collection-apps { padding-block-start:40px;margin-block-end:32px; }
:root body.cohesive-site.modern-layout .simulation-story { padding:48px;margin-block:32px 64px;border-radius:24px; }
:root body.cohesive-site.modern-layout .improvement-loop { padding:32px 28px 16px;border-radius:18px; }
:root body.cohesive-site.modern-layout .improvement-values { gap:32px;margin-block-start:32px; }
:root body.cohesive-site.modern-layout .improvement-values article+article { border:0;padding-inline-start:0; }
:root body.cohesive-site.modern-layout .improvement-values h3 { font-size:21px;letter-spacing:-.025em; }
/* Native hidden semantics stay intact; the active slide grows with every locale. */
:root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-slide[hidden] { display:none!important; }
[dir="rtl"] body.cohesive-site.modern-layout .shared-hero .slide-explanation .nav-arrow { transform:scaleX(-1); }
@media(min-width:641px) {
  [dir="rtl"] body.cohesive-site.modern-layout .shared-workflow-story .setup-arrow { transform:scaleX(-1); }
}
/* Hebrew follows the same physical title-left / feature-right layout on desktop. */
html[lang="he"] body.cohesive-site.modern-layout .shared-hero h1 { letter-spacing:-.025em;line-height:1.12; }
@media(min-width:901px) and (max-width:1100px) {
  :root body.cohesive-site.modern-layout .shared-hero { gap:32px; }
  :root body.cohesive-site.modern-layout .shared-hero .environment-story { padding:24px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-window { height:auto;min-height:478px; }
}
@media(max-width:900px) {
  :root body.cohesive-site.modern-layout .shared-hero { grid-template-columns:minmax(0,1fr);gap:36px;padding-block:44px 40px; }
  :root body.cohesive-site.modern-layout .shared-hero h1 { max-width:19ch;font-size:clamp(40px,6.5vw,58px); }
  :root body.cohesive-site.modern-layout .shared-hero .hero-description { max-width:57ch; }
  :root body.cohesive-site.modern-layout .shared-hero .environment-story { padding:28px 32px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-window { height:auto;min-height:430px; }
  :root body.cohesive-site.modern-layout .shared-hero .slide-explanation p { max-width:65ch; }
  :root body.cohesive-site.modern-layout .simulation-story { padding:32px; }
  :root body.cohesive-site.modern-layout :is(.workflow-heading,.simulation-story>.section-heading) { gap:28px; }
}
@media(max-width:640px) {
  :root body.cohesive-site.modern-layout .shared-hero { padding-block:32px;gap:30px; }
  :root body.cohesive-site.modern-layout .shared-hero h1 { font-size:40px;max-width:18ch;margin-block-end:22px; }
  :root body.cohesive-site.modern-layout .shared-hero .hero-description { font-size:15px;line-height:1.75;margin-block-end:26px; }
  :root body.cohesive-site.modern-layout .shared-hero .button { font-size:12px;padding:12px 15px; }
  :root body.cohesive-site.modern-layout .shared-hero>.development-world { border-radius:20px; }
  :root body.cohesive-site.modern-layout .shared-hero .environment-story { padding:24px 22px 22px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-window { height:auto;min-height:438px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-slide { grid-template-rows:225px auto;gap:24px; }
  :root body.cohesive-site.modern-layout .shared-hero :is(.connector-constellation,.slide-company-diagram,.monitoring-timeline) { height:225px; }
  :root body.cohesive-site.modern-layout .shared-hero .local-collection .constellation-field { width:225px; }
  :root body.cohesive-site.modern-layout .shared-hero .slide-company-diagram>.generated-green-art { height:225px;max-width:280px; }
  :root body.cohesive-site.modern-layout .shared-hero .modern-monitoring-art { max-height:225px;max-width:315px; }
  :root[data-theme="dark"] body.cohesive-site.modern-layout .shared-hero .hero-pixel-art { height:225px; }
  :root body.cohesive-site.modern-layout .shared-hero .slide-explanation h3 { font-size:25px; }
  :root body.cohesive-site.modern-layout .shared-hero .slide-explanation p { font-size:13px;line-height:1.7;margin-block-end:16px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls { gap:4px;padding-block-start:16px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls button { padding:9px 10px;font-size:11px; }
  :root body.cohesive-site.modern-layout :is(.data-story,.monitoring-story) { padding-block:16px;margin-block:24px 36px; }
  :root body.cohesive-site.modern-layout :is(.workflow-heading,.simulation-story>.section-heading) { gap:20px;margin-block-end:28px; }
  :root body.cohesive-site.modern-layout .toolkit-overview { gap:8px;margin-block:8px 22px; }
  :root body.cohesive-site.modern-layout .toolkit-overview a { padding-block:10px;gap:9px;font-size:13px; }
  :root body.cohesive-site.modern-layout .local-protection-layout { padding:24px 20px;gap:28px; }
  :root body.cohesive-site.modern-layout .collection-apps { padding-block-start:30px;margin-block-end:24px; }
  :root body.cohesive-site.modern-layout .simulation-story { padding:24px;margin-block:24px 36px;border-radius:20px; }
  :root body.cohesive-site.modern-layout .improvement-loop { padding:24px; }
  :root body.cohesive-site.modern-layout .improvement-values { gap:24px;margin-block-start:28px; }
}
@media(max-width:380px) {
  :root body.cohesive-site.modern-layout .shared-hero h1 { font-size:35px; }
  :root body.cohesive-site.modern-layout .shared-hero .environment-story { padding-inline:18px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-window { height:auto;min-height:475px; }
  :root body.cohesive-site.modern-layout .shared-hero .slide-explanation h3 { font-size:23px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls { gap:4px; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls button { padding-inline:8px;font-size:10px; }
  :root body.cohesive-site.modern-layout .simulation-story { padding:20px; }
}
@media(prefers-reduced-motion:reduce) {
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-slide { animation:none; }
}
@media(forced-colors:active) {
  :root body.cohesive-site.modern-layout .shared-hero>.development-world { background:Canvas;border-color:CanvasText; }
  :root body.cohesive-site.modern-layout .shared-hero .button:not(.button-light) { background:ButtonFace;border-color:ButtonText;color:ButtonText; }
  :root body.cohesive-site.modern-layout .shared-hero .toolkit-preview-controls button { border-color:ButtonText; }
}
