/* Cooperation composition from the supplied Magic Mess reference. */
.formats.cooperation{background:#f8f5fc;color:#000;border-top:6px solid var(--acid);padding-top:48px;padding-bottom:48px}
.cooperation-head{position:relative}
.cooperation-head h2{max-width:none;font-size:clamp(24px,2.85cqw,41px);line-height:1.16;letter-spacing:-.055em}
.cooperation-head>p{margin-top:20px;font:18px/1.45 Arial,Helvetica,sans-serif;max-width:none}
.cooperation-kicker{position:absolute;right:0;top:0;display:flex;align-items:center;gap:20px;color:var(--purple);font:12px/1.7 Arial,sans-serif;letter-spacing:.3em;text-transform:uppercase}
.cooperation-kicker b{font-size:42px;line-height:1}
.cooperation-map{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.22fr) minmax(0,1fr);gap:6.3%;margin-top:28px;min-height:565px;isolation:isolate}
.cooperation-side{position:relative;z-index:2;display:flex;flex-direction:column;gap:16px;min-width:0}
.cooperation-left{padding-top:36px;gap:44px}
.cooperation-card{position:relative;min-height:174px;padding:20px 22px;border-radius:15px;background:#e9def6;overflow:hidden}
.cooperation-left .cooperation-card{min-height:200px}
.cooperation-card.marketing{min-height:220px}
.cooperation-card.lime{background:linear-gradient(110deg,#c6fb00,#b7f200)}
.cooperation-card.dark{background:#0c0c0c;color:white}
.cooperation-card h3{position:relative;z-index:2;font-size:22px;line-height:1.2;letter-spacing:-.045em;margin:0 0 14px}
.cooperation-card p{position:relative;z-index:2;max-width:calc(71% - 24px);font:13px/1.45 Arial,Helvetica,sans-serif}
.cooperation-card>img{position:absolute;right:12px;bottom:24px;width:29%;height:94px;object-fit:contain}
.cooperation-card .cooperation-arrow{display:grid;place-items:center;width:33px;height:33px;border:1.5px solid currentColor;border-radius:50%;color:var(--purple);background:transparent;text-decoration:none;margin-top:16px;font:25px/1 Arial,sans-serif;transition:background .2s,transform .2s;position:relative;z-index:3}
.cooperation-card.lime .cooperation-arrow{color:#000}
.cooperation-card.dark .cooperation-arrow{color:#fff}
.cooperation-arrow:hover{background:#ffffff60;transform:translateX(3px)}
.cooperation-card .cooperation-arrow:focus-visible{outline:3px solid var(--purple);outline-offset:3px}
.cooperation-card.dark .cooperation-arrow:focus-visible{outline-color:var(--acid)}
.cooperation-center{position:relative;z-index:2;align-self:start;margin-top:26px;min-height:470px;border-radius:15px;background:linear-gradient(140deg,#6724d6,#702bd5);color:#fff;padding:112px 20px 30px;text-align:center;min-width:0}
.cooperation-brand{font:800 clamp(34px,4.05cqw,58px)/.98 var(--heading);letter-spacing:-.065em}
.cooperation-cross{display:block;color:var(--acid);font:800 64px/.9 Arial,sans-serif;margin:8px 0 14px}
.cooperation-business{font:800 clamp(20px,1.95cqw,28px)/1.15 var(--heading);letter-spacing:-.035em;white-space:nowrap}
.cooperation-motto{position:absolute;top:22px;right:17px;transform:rotate(-13deg);text-align:left;color:var(--acid);font:italic 20px/.95 'Comic Sans MS',cursive}
.cooperation-star{position:absolute;left:24px;top:22px;color:var(--acid);font:64px/1 Arial,sans-serif}
.cooperation-center .cooperation-message{position:relative;z-index:2;margin:30px 0 0;text-align:center;font:12px/1.7 Arial,sans-serif;letter-spacing:.25em;text-transform:uppercase}
.cooperation-can{position:absolute;width:auto;object-fit:contain;max-width:none;filter:drop-shadow(0 8px 7px #0003);z-index:4}
.cooperation-can.upright{height:265px;left:6px;bottom:-43px}
.cooperation-can.laying{height:190px;left:96px;bottom:-102px;transform:rotate(78deg);z-index:3}
.cooperation-duck{position:absolute;right:0;bottom:0;width:100px;height:105px;object-fit:contain;opacity:.55}
.cooperation-connectors{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:0;pointer-events:none}
.cooperation-connectors path{fill:none;stroke-width:2.2;vector-effect:non-scaling-stroke}
.cooperation-node{position:absolute;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;z-index:3;background:var(--purple);color:white}
.cooperation-node svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cooperation-node.acid{background:var(--acid);color:#000}
.cooperation-node.n1{left:calc(28% - 23px);top:92px}
.cooperation-node.n2{left:calc(28% - 23px);top:320px}
.cooperation-node.n3{right:calc(28.5% - 23px);top:56px}
.cooperation-node.n4{right:calc(28.5% - 23px);top:288px}
.cooperation-node.n5{right:calc(28.5% - 23px);top:456px}
.cooperation-footer{display:flex;align-items:center;gap:18px;max-width:880px;margin:6px 0 0 14px;color:var(--purple);font:12px/1.5 Arial,sans-serif;letter-spacing:.28em;text-transform:uppercase}
.cooperation-footer::after{content:'';height:1px;flex:1;background:var(--purple)}
@container page (max-width:1100px){
 .cooperation-head{padding-right:0}.cooperation-kicker{display:none}
 .cooperation-map{gap:24px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:0}
 .cooperation-center{grid-column:1/-1;grid-row:1;width:min(100%,430px);justify-self:center;margin:0;min-height:470px}
 .cooperation-brand{font-size:56px}.cooperation-business{font-size:27px}
 .cooperation-left{padding-top:0;gap:16px}.cooperation-side .cooperation-card{min-height:220px}
 .cooperation-connectors,.cooperation-node{display:none}
 .cooperation-footer{margin-top:28px;max-width:none}
}
@container page (max-width:600px){
 .formats.cooperation{padding-top:40px;padding-bottom:40px}
 .cooperation-head h2{font-size:27px}.cooperation-head>p{font-size:17px;margin-top:18px}
 .cooperation-map{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:28px}
 .cooperation-center{grid-column:1;margin-bottom:0;min-height:440px;padding-top:112px}
 .cooperation-brand{font-size:clamp(34px,11cqw,50px)}.cooperation-business{font-size:clamp(16px,5.4cqw,23px)}
 .cooperation-motto{font-size:18px;top:16px;right:15px}.cooperation-star{font-size:50px;left:18px}
 .cooperation-center .cooperation-message{font-size:10px;letter-spacing:.18em}
 .cooperation-can.upright{height:230px;bottom:-35px}.cooperation-can.laying{height:160px;left:83px;bottom:-82px}
 .cooperation-duck{width:85px}
 .cooperation-card h3{font-size:21px}.cooperation-card p{font-size:15px;max-width:calc(70% - 20px)}
 .cooperation-side .cooperation-card{min-height:225px}
 .cooperation-card>img{height:100px;width:30%;right:10px}
 .cooperation-footer{font-size:10px;letter-spacing:.18em;margin-left:0}.cooperation-footer::after{display:none}
}
