#cai-assurance-cylinders{background:#fff;color:#101b2c;font-family:Arial,Helvetica,sans-serif;padding:24px;box-sizing:border-box}
#cai-assurance-cylinders *{box-sizing:border-box}
#cai-assurance-cylinders .motion-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}
#cai-assurance-cylinders h2{font-size:28px;font-weight:500;margin:0 0 8px;letter-spacing:-.7px}
#cai-assurance-cylinders p{color:#526078;font-size:14px;margin:0}
#cai-assurance-cylinders button{background:white;color:#101b2c;border:1px solid #dce2ec;padding:10px 16px;font:14px Arial;min-height:44px}
#cai-assurance-cylinders canvas{display:block;width:100%;aspect-ratio:1.18;margin-top:15px}
#cai-assurance-cylinders .motion-footer{font-size:13px;border-top:1px solid #dce2ec;padding-top:15px;color:#526078}
@media(max-width:500px){#cai-assurance-cylinders{padding:16px}#cai-assurance-cylinders h2{font-size:23px}#cai-assurance-cylinders canvas{aspect-ratio:1}}

.assurance-architecture{padding:60px 6%;max-width:1400px;margin:auto}

/* Compact architecture layout */
.assurance-architecture{padding:28px 6%;max-width:1000px;margin:0 auto}
#cai-assurance-cylinders{max-width:640px;margin:0 auto;padding:16px}
#cai-assurance-cylinders h2{font-size:23px}
#cai-assurance-cylinders canvas{margin-top:8px}
@media(max-width:500px){.assurance-architecture{padding:20px 4%}#cai-assurance-cylinders{padding:8px}}

/* Blend architecture into the blue hero */
.hero #cai-assurance-cylinders{background:transparent;color:#fff}
.hero #cai-assurance-cylinders .motion-footer{color:#fff;border-top-color:#ffffff45}
.hero #cai-assurance-cylinders button{background:transparent;color:#fff;border-color:#ffffff70}

/* Smaller, left-aligned hero animation */
.hero .assurance-architecture{width:100%;max-width:480px!important;margin:0!important;padding:4px 0 16px!important;background:transparent!important}
#cai-assurance-cylinders{background:transparent!important;max-width:480px;margin:0!important;padding:0}
#cai-assurance-cylinders canvas{margin-top:4px}
.hero #cai-assurance-cylinders .motion-heading{justify-content:flex-start}

/* Hero illustration beside the heading and introduction */
.hero-composition{display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);gap:36px;align-items:center;margin:44px 0 24px}
.hero .hero-composition h1{font-size:clamp(36px,4.6vw,68px);letter-spacing:-2px;line-height:1.08;margin:0 0 28px}
.hero-composition .hero-bottom{display:block}
.hero-composition .hero-bottom p{font-size:18px;margin:0;max-width:620px}
.hero-composition .assurance-architecture{min-width:0}
@media(max-width:850px){.hero-composition{grid-template-columns:1fr;gap:24px;margin-top:30px}.hero-copy{grid-row:1}.hero .hero-composition h1{font-size:clamp(36px,7vw,60px)}.hero-composition .assurance-architecture{grid-row:2}}

/* Compact side illustration */
.hero .hero-composition{grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:40px}
.hero .hero-composition .assurance-architecture{max-width:360px!important;width:100%;margin:0!important;padding:0!important}
.hero .hero-composition #cai-assurance-cylinders{max-width:360px;width:100%;padding:0}
@media(max-width:700px){.hero .hero-composition{grid-template-columns:1fr;gap:20px}}

/* Text left, compact illustration right */
.hero .hero-composition{grid-template-columns:minmax(0,1fr) 360px;gap:40px;align-items:center}
.hero .hero-composition .hero-copy{grid-column:1;grid-row:1;min-width:0}
.hero .hero-composition .assurance-architecture{grid-column:2;grid-row:1;justify-self:end}
@media(max-width:700px){.hero .hero-composition{grid-template-columns:1fr}.hero .hero-composition .hero-copy{grid-column:1;grid-row:1}.hero .hero-composition .assurance-architecture{grid-column:1;grid-row:2;justify-self:start}}