/* 04 / One partner — everything we do, held together like a puzzle cube */
.onecube{position:relative;overflow:hidden;background:#f5f7fa}
.onecube::before{content:"";position:absolute;right:-10%;top:50%;width:900px;height:900px;transform:translateY(-50%);pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(91,95,224,.22),rgba(42,45,159,.08) 40%,rgba(245,247,250,0) 68%)}
.oc-layout{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:60px;align-items:center}
.oc-copy .eyebrow{margin-bottom:24px}
.oc-copy h2{margin:0 0 22px}
.oc-copy h2 span{color:#2a2d9f}
.oc-lead{font-size:15px;line-height:1.8;color:var(--muted,#3b3f66);max-width:520px;margin:0 0 30px}
.oc-lead strong{color:#2a2d9f;font-weight:600}
.oc-list{list-style:none;padding:0;margin:0 0 28px;display:grid;grid-template-columns:1fr 1fr;gap:0 32px;max-width:560px}
.oc-list li{display:flex;flex-direction:column;gap:3px;padding:14px 0;border-top:1px solid #e4e7f1}
.oc-list b{font-size:15px;font-weight:600;color:#0f1233}
.oc-list span{font-size:12px;line-height:1.55;color:#5c5e80}
.oc-goal{display:flex;align-items:center;gap:12px;margin:0;font-size:14px;color:#0f1233;font-weight:500}
.oc-dot{width:8px;height:8px;border-radius:50%;background:#2a2d9f;box-shadow:0 0 0 5px rgba(42,45,159,.12)}

/* the cube */
.oc-stage{position:relative;height:520px;display:grid;place-items:center}
.oc-glow{position:absolute;inset:8% 6%;border-radius:50%;background:radial-gradient(circle,rgba(91,95,224,.35),rgba(42,45,159,.12) 45%,rgba(42,45,159,0) 70%);filter:blur(10px)}
.oc-shadow{position:absolute;left:50%;bottom:40px;width:300px;height:40px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,rgba(15,18,51,.28),rgba(15,18,51,0) 70%)}
.oc-scene{position:relative;width:var(--oc-size,252px);height:var(--oc-size,252px);perspective:1100px}
.oc-cube{position:absolute;inset:0;transform-style:preserve-3d}
.oc-layer{position:absolute;inset:0;transform-style:preserve-3d}
.oc-cb{position:absolute;left:50%;top:50%;width:var(--oc-u,84px);height:var(--oc-u,84px);margin:calc(var(--oc-u,84px) / -2);transform-style:preserve-3d}
.oc-f{position:absolute;inset:0;background:#0f1233;border-radius:4px;backface-visibility:hidden}
.oc-f.st{padding:5px;background:#0f1233}
.oc-f.st i{position:absolute;inset:5px;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;font-style:normal;
  color:#fff;font:600 11px/1.15 'Poppins',Arial,sans-serif;letter-spacing:.01em;padding:6px;
  background:linear-gradient(145deg,var(--a,#5b5fe0),var(--b,#2a2d9f));box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -8px 16px rgba(10,12,60,.25)}
.oc-f.st i svg{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.95}
.oc-f.st i.hub{background:linear-gradient(145deg,#ffffff,#dfe2ff);color:#2a2d9f;font-size:10px}
.oc-f.st i.hub b{font-size:24px;line-height:1;font-weight:400}
@media(max-width:1100px){.oc-layout{grid-template-columns:1fr;gap:20px}.oc-stage{height:440px;--oc-size:216px;--oc-u:72px}}
@media(max-width:760px){.oc-list{grid-template-columns:1fr}.oc-stage{height:360px;--oc-size:180px;--oc-u:60px}.oc-f.st i{font-size:9px}.oc-f.st i svg{width:15px;height:15px}}

/* no background glow — plain section, the cube carries the colour */
.onecube::before,.oc-glow{display:none}

/* hub-no-spark: the centre tile reads simply "Your business" */
.oc-f.st i.hub{font-size:12px;line-height:1.2}

/* lighter cube: thin soft-lavender gaps between tiles instead of heavy black dividers */
.oc-f{background:#c9cdf3}
.oc-f.st{padding:3px;background:#d9dcf7}
.oc-f.st i{inset:3px;border-radius:10px}
/* gaps a touch darker so the cube's edge doesn't melt into the white page */
.oc-f{background:#aeb3dc}
.oc-f.st{background:#bfc3e6;box-shadow:inset 0 0 0 1px rgba(42,45,159,.18)}

/* richer, calmer cube: white / milk-white / light-grey tiles with navy text; the centre stays brand blue */
.oc-f{background:#c4c7d3}
.oc-f.st{background:#d3d6df;box-shadow:inset 0 0 0 1px rgba(15,18,51,.10)}
.oc-f.st i{color:#1d2152;box-shadow:inset 0 1px 0 #fff,inset 0 -10px 18px rgba(15,18,51,.06)}
.oc-f.st i svg{stroke:#2a2d9f}
.oc-f.st i svg text{fill:#2a2d9f}
.oc-f.st i.hub{background:linear-gradient(145deg,#5b5fe0,#2a2d9f);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
/* bigger cube, filling the section height */
.oc-stage{height:560px;--oc-size:330px;--oc-u:108px}
.oc-f.st i{font-size:12.5px}.oc-f.st i svg{width:24px;height:24px}
.oc-shadow{width:360px;bottom:18px}
@media(max-width:1100px){.oc-stage{height:460px;--oc-size:250px;--oc-u:82px}}
@media(max-width:760px){.oc-stage{height:360px;--oc-size:186px;--oc-u:62px}.oc-f.st i{font-size:9px}.oc-f.st i svg{width:15px;height:15px}}
